1. TECH LIBRARY
  2. CSS
  3. 【CSS】overflow-scrolling: touchが不要になりました

【CSS】overflow-scrolling: touchが不要になりました

2020.4.7

みなさんはスクロールをスムーズにさせる慣性スクロールのCSSって書いていますか?
ハンバーガーメニューなどスクロールバーを表示させる場合に使う機会がよくあるかと思います。
その慣性スクロールですが、デフォルトで適用されるようになっていました!

調べたところ、Safari 13でデフォルトがtouchになったようでした。
Safari 13 Release Notes

今まではoverflow: scrollを当てたときiOS Safariではデフォルトだと慣性スクロールになっていないので以下のCSSを書く必要があったのですが、この指定が不要になるということですね。

.scroll {
  -webkit-overflow-scrolling: touch;
}

ただ、あえてautoの指定をしているサイトがあれば確認が必要かもしれません。
以下のようにautoを指定しても慣性スクロールのままだったので、プロパティ自体が無効になったようです。

.scroll {
  -webkit-overflow-scrolling: auto;
}

この手法も過去の遺産になるのかとしみじみ思う次第ですね。

カテゴリ「CSS」の新着記事

  1. TECH LIBRARY
  2. CSS
  3. 【CSS】overflow-scrolling: touchが不要になりました

カテゴリ

お気に入りリストに追加しました

お問い合わせを送信しました