コンテンツが人画面に収まりつつ、スクロールすると次のコンテンツが表示されるプラグインです。
デモページ
デモページ
HTMLのclass="section"ごとに下からズズッと表示される感じです。
コンテンツがウインドウサイズより長くても大丈夫
一つのコンテンツがウインドウサイズより長くてもスクロールで見れるようにしたかったのでそのようになっています。内容量を気にしません。
コンテンツ量が少ないとウインドウ幅いっぱいに要素が広がるようになっています。
実行方法
$('#wrap').scrollContent();
wrapの箇所をスクロール表示したい親要素を指定します。
スクロールバーを非表示にしたい
前途の理由で移動の際にもスクロールバーが出ます。このスクロールバーがない方がいい時は以下のように実行します。
$('#wrap').scrollContent({
type:'noBar'
});
ナビゲーションのclass(id)を変えたい
ナビにつかうclassを変えたい時もあるかなと思い、オプションでナビゲーションのclass(id)を変更できます。指定しないと.navが適用されます。
$('#wrap').scrollContent({
nav:'.nav'
});
ダウンロード
ダウンロードはこちらら
webdrawer-kashu/contentScroll
この記事の転載元
コンテンツが下からスクロールで表示されるjQueryプラグイン|WEB Drawer|web制作に関するネタの引き出しサイト