scrollifyの活用
![](http://dsk-code.com/wp-content/uploads/2022/02/scrollify.jpg)
目次
概要
特定のSectionまでスクロールしたら背景色が変化
Point
スクロールの途中から背景色を変化させサイトのイメージ変化。
下記、コピペでイメージ確認可能。
各種設定
1.CDNの読み込み。
CDN:CDNjs
https://cdnjs.cloudflare.com/ajax/libs/scrollify/1.0.21/jquery.scrollify.min.js
2.各Sectionには同じClass名を設定し、そのClass名をjsの「section」に記載。※下記Sampleでは「example-classname」。
Sample
1.サンプル➀
・各Sectionにはheightは設定しない。
2.サンプル➁ (ページャー追加)
・すべてのsectionを囲む。下のSampleではmainで囲んでいる。
・ページャーの位置はClass「pager」で変更。
See the Pen
Untitled by DSK (@DSK1413)
on CodePen.