[JS]スクロールを楽しくするパララックスを簡単に実装できる超軽量スクリプト -skrollr
jQueryなどの他のスクリプトに依存せず、スタンドアローンでパララックスのエフェクトを実装できる超軽量（2.2KB）のスクリプトを紹介します。 skrollr -GitHub [ad#ad-2] skrollrのデモ skrollrの使い方 skrollrのデモ パララックスは複数のエレメントを異なるスピードで動かすことで奥行きの錯覚を起こすもので、skrollrはスクロールの量に応じて、ページ上の各エレメントにさまざまなスタイルを定義することができます。 デモではその面白いパララックスのエフェクトが楽しめます。 デモは3つあり、まずはskrollrが楽しめるメインのデモから紹介します。
jQuery でページスクロール - daily dayflower
jQuery 1.2 以降だと scrollTop（と scrollLeft）という疑似スタイルが利用できるようになったので，jQuery UI を使わずとも，jQuery Core 本体だけでページ内スクロールができるようになりました。 たとえば， <html> <body> <p> blah, blah, blah, ... blah, blah, blah, ... </p> <p> <a href="#" id="link_to_top">ページの先頭へ</a> </p> </body> </html> このような HTML で「ページの先頭へ」というリンクをクリックしたときに，スムーズにスクロールしたいのなら， $(function () { if (! $.browser.safari) { $('#link_to_top').click(function () { $(thi
Easingプラグインを使ったページスクロールサンプル
Easingプラグインを使ったページスクロールサンプル > アーカイブ > 5509 durationは400～1200が適正
ひと味違ったページ内スクロールをjQuery Easingプラグインで実装する jQuery.easing.scroll.js :: 5509
ひと味違ったページ内スクロールをjQuery Easingプラグインで実装する jQuery.easing.scroll.js サンプルを見る (IE6では確認できません jQueryを使うとかなり簡単にページ内スクロールが実装できるのですが、さらにjQuery Easingプラグインと合わせるとなかなか面白い動きができたりします。 というわけで誰でも簡単に導入できるようにプラグインにしました。以前にslideScroll.js(jQueryプラグイン版）というページ内スクロールの記事を書きましたが、悲しいことに断然こちらのほうがおすすめです。動きが滑らか…そして自分の好きな動きから選べます。 今回はソースの解説もしてるので、興味のある人は見てみてください。 ページ内スクロールプラグインなのに、7KBもあるのはEasingプラグインの容量が5KBだから…これを機に他のアニメーション部分でも
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
