パネルにスタッキング効果を実装できるjQueryプラグイン「StickyStack.js」

StickyStack.js

StickyStack.jsはパネルにスタッキング効果を実装することができるjQueryプラグインです。コンテンツはパネル単位になっており、スクロールしていくことでパネルがどんどん積み重なっていくような感じでスタッキングされます。

StickyStack.js

デモ

ブラウザ画面いっぱいに広がったパネルがスクロールすることでどんどんスタッキングされていきます。とてもダイナミックで見応え感がありますね。

スクロールされるパネルは画面のトップまでくると次のパネルが下から表示されてきます。新しいパネルが次々に前面にくるようになっています。

逆スクロールすると積み重なったパネルがどんどんめくれていきます。

使い方はこんな感じです。

$('.main-content-wrapper').stickyStack({
    containerElement: '.main-content-wrapper',
    stackingElement: 'section',
    boxShadow: ''0 -3px 20px rgba(0, 0, 0, 0.25)'
});

ボックスシャドウもオプションで調節することができます。

StickyStack.js

スポンサーリンク

スポンサーリンク

アクセスランキング

Tags

オススメ商品

Archives