logo
  • 現在做什麼
  • 關於我

Kalan

文章分類

  • 前端
  • 開發筆記
  • 雜談
  • 年度回顧

快速連結

  • 現在做什麼
  • 關於我
  • 聯絡我
  • 職涯思考🔗

關注我

在福岡生活的開發者,分享軟體開發與日本生活的點點滴滴。

© 2025 Kalan Made with ❤️. All rights reserved.

CSS の 1 行でスムーズなスクロールを行う方法

作成者:カランカラン2020年5月7日 1:57
ホーム/フロントエンド
💡

質問やフィードバックがありましたら、フォームからお願いします

英語原文

目次

    本文は台湾華語で、ChatGPT で翻訳している記事なので、不確かな部分や間違いがあるかもしれません。ご了承ください

    楽しく Svelte で smooth-scroll を実装した後、実は一行の CSS で実現できることに気づきました:

    html {
      scroll-behavior: smooth;
    }

    ブラウザのサポートについては少し気にする必要がありますが、開発者がライブラリを導入したり、自分で実装したりする手間を完全に省くことができます。

    Screenshot_2020-05-07 scroll-behavior

    smooth-scroll を完璧に達成できて、hashchange や state change の動作を書き換える必要もありません。今度は CSS を使わずに smooth-scroll を実現する方法について記事を書こうと思います。

    ← Github アクションをプロジェクトに取り込む方法JSON パーサーを一から作成する (1) →

    この記事が役に立ったと思ったら、下のリンクからコーヒーを奢ってくれると嬉しいです ☕ 私の普通の一日が輝かしいものになります ✨

    ☕Buy me a coffee