パララックスサイトを簡単に作成できるjQueryプラグイン8選

パララックスサイトを簡単に作成できるjQueryプラグイン8選
いまさらな気もしますが、パララックスなサイトを簡単に実現するためのjQueryプラグインを紹介します。

#1 Nikebetterworld Parallax Effect Demo | Ian Lunn 老舗な感じのところですね。
jQuery localscrollとか、jQuery scrollToを駆使しています。
URL:http://ianlunn.co.uk/articles/recreate-nikebetterworld-parallax/
demo:http://ianlunn.co.uk/plugins/jquery-parallax/

#2 JoelBesada/scrollpath GitHub 見えないパスにそってスクロールしていって気持ちいい感じです。
こんな記述が必要です。
.arc(1800, 1000, 600, Math.PI/2, 0, true, {rotate: Math.PI/2 }) URL:https://github.com/JoelBesada/scrollpath
demo:http://joelb.me/scrollpath/

#3 scrolldeck.js スクロールにあわせて左右からキュンキュンくる最近よくあるタイプです。
URL:http://johnpolacek.github.io/scrolldeck.js/
demo:http://johnpolacek.github.io/scrolldeck.js/decks/responsive/

#4 SUPERSCROLLORAMA やりすぎに注意っていうくらいの多彩なことができます。
URL:http://johnpolacek.github.io/superscrollorama/

#5 curtain.js シンプルな感じで、要素ごとに切り替えられます。
URL:https://github.com/victa/curtain.js
demo:http://www.aainc.co.jp/logorenew/

#6 Parallax-JS そこそこの柔軟性がありつつ記述も簡単なプラグインです。
こんな感じ
<section anim-pause="200"> URL:https://github.com/razorfish/Parallax-JS
demo:http://razorfish.github.io/Parallax-JS/

#7 skrollr これもわりとガリガリ動きまわる感じのプラグインです。
利用されているサイトも多いので、導入の参考にしやすそうです。
URL:https://github.com/Prinzhorn/skrollr
demo:http://prinzhorn.github.io/skrollr/

#8 jQuery scroll parallax plugin 横スクロールもあるので、年表系とかでも使えそうです。
URL:http://www.davecranwell.com/content/jquery-scroll-parallax-plugin
demo:http://www.davecranwell.com/sites/default/files/examples/scroll-parallax/index-horizontal.html
横スクロール
http://timeline.lshtm.ac.uk/

sponsors

「パララックスサイトを簡単に作成できるjQueryプラグイン8選」をシェアする

記事作成:
記事URL:

TOP > > > パララックスサイトを簡単に作成できるjQueryプラグイン8選