モダンなJSとCSSで作るライブラリ不要の全画面スクロール演出（2019年版） - ICS MEDIA

スクロールで全画面がスライドのように切り替わるウェブサイトの表現があります。手軽にこの表現を実装するJSライブラリ、fullPage.jsを使ったことのある方もいるのではないでしょうか？ かつては無料で使えたこのライブラリですが、現在はGPLライセンスのプロジェクト以外では使用料がかかります。 その一方、CSSとJavaScriptの進化により、このような表現をライブラリを使わずとも比較的簡単に実装できるようになりました。本記事では、基本的な機能をおさえた、全画面スクロールの実装方法を紹介します。 この記事を通じて以下の技術も学べます。 スクロールをピタッと止めるCSSプロパティscroll-snap-type 画面と要素の交差を検知するIntersection Observer API スムーススクロールが実装できるJavaScriptメソッドscrollIntoView() デモを別ウ

[ultimatebreak]

スクロールいじってるサイトは使いづらいというか予測と反する挙動になるのでクソ認定してる

[klim0824]

scroll-snap-type初めて知ったし、IE11でも使えて更に驚き

[coppieee]

えっ、超便利そうじゃん 知らなかった

[bleu-bleut]

・スクロールをピタッと止めるCSSプロパティscroll-snap-type ・画面と要素の交差を検知するIntersection Observer API ・スムーススクロールが実装できるJavaScriptメソッドscrollIntoView()

[d4-1977]

scroll-snap-type なんてあったの？知らなかったよ…

[thessalonica]

めっちゃいい

[Fushihara]

スクロールジャックほんといらねーー！！！

[Keisuke69]

そもそも全画面スクロールの善し悪し

[toku-hiro]

渡辺美里

[mayumayu_nimolove]

IE11にいつまでも対応してると苦しむのは自分