Webサイトを作成していて、スマホ版を作った際にスクロールがカクカクする、もしくはヌルッとスクロールしない(なんとなく硬い感じでしかスクロールしない)場合がある。
調べたところ、overflow要素をスクロールさせた場合に起こる現象らしい。
自分で確認できたのは
・iPhone7 Safari
・iPhone7Plus Safari
の標準ブラウザ。
これを解消するには、overflowを設定している要素に下記コードを追記すればいい。
[css]
-webkit-overflow-scrolling: touch;
[/css]
設定値は、「auto」「touch」だそうだ。