CSS1行だけで、スムーズスクロールが可能になる方法
スムーズスクロールとは、サイトをタップするだけでアンカーを付けた箇所に画面が滑らかに移動する動きのことです。
今回は、JavaScriptを使用せず、スムーズスクロールをCSSだけで実装する方法を紹介します。
html{ scroll-behavior: smooth; }
このスムーズスクロールは、ランディングページのナビメニューを設定する際などに便利です。
注意:モーダルウィンドウなど、その他の設定がある場合は影響が出る可能性があるため、JavaScriptの使用をお奨めします。また、bodyタグには効かないため、必ずHTMLタグを指定してください。
Webデザイナー / コーダーのみなさまへ
株式会社オートプロジェクトでは、バックエンド全般を安心してお任せいただけます。
サーバー設定やDB管理、セキュリティ対策など幅広いニーズに対応いたします。お気軽にご相談ください。
