CSSだけでも実装できる！ページ内アンカーやページ上部にアニメーションでスクロールさせるCSS, JavaScriptのまとめ

ページ内のアンカーやページの上部にアニメーションで、スムーズにスクロールさせるCSS、単体のJavaScript、Vue.jsやjQueryのプラグインを紹介します。 現在では、CSSだけでも実装できるようになりました。IEは例のごとく非対応ですが、ポリフィルがあるので利用できます。 イラスト: Girls Design Materials CSSでページをアニメーションでスクロールさせる JavaScript単体でページをアニメーションでスクロールさせる プラグインでページをアニメーションでスクロールさせる CSSでページをアニメーションでスクロールさせる CSSのプロパティ「Scroll-behavior」を使用すると、アニメーションを使用してスムーズにスクロールさせることができます。 Scroll-behaviorのサポートブラウザ scroll-behavior -MDN web

[coliss]

単体で動作するスクリプトがだいぶ増えてきた。

[takryou79]

CSS

[hapilaki]

“ 2018年現在、対応ブラウザはChrome, Firefoxのみですが、ポリフィルも用意されているのでIEなどで使用することも可能。値にはキーワードを指定します。 「auto」は通常のスクロール、「smooth」はスムーズにスクロール。”

[norando]

スクロールさせるネイティブのプロパティ

[kathew]

CSS何でもありだな

[karatte]

"CSSのプロパティ「Scroll-behavior」を使用すると、アニメーションを使用してスムーズにスクロールさせることができます"

[kicchysan]

CSSだけでも実装できる！ページ内アンカーやページ上部にアニメーションでスクロールさせるCSS, JavaScriptのまとめ #CSS #JavaScript https://coliss.com/?p=23723