君の名は・・・iOSでスクロールすると、表示される謎の隙間
WordPressの5.0が出そうで出ないので、ドキドキしているyanagimachiです。
「Gutenberg」エディタはプラグインで何度か使ってみたのですが、まだ使い慣れていないので精進したいところです。
さて、表題のアレ、先日公開したバシャログ。メンバー所属のシーブレインWebソリューション事業部のサイトでも起こっていますね。ページの一番下でグイグイ上にスワイプすると領域外っぽい白い（bodyの背景の色）ところが表示されてしまいます。
※ちなみにAndroid/Chromeだと下からもやのようなものが出ます。
これは何？
上下のスクロール領域の境界に到達したときに、「もうこれ以上スクロールができない」ことを表すインタラクション（下の場合はバウンスエフェクト）のようです。
CSSやJSでは何か設定できるの？
overscroll-behaviorというCSSのプロパティがあるのですが、まだiOSには対応していません。
Android/Chromeでは以下のCSSを追加すると、もやが消えました。
body {
overscroll-behavior: none;
}
上記のCSSでは、他にも最上部スクロールでの更新も無くなりました。
タッチデバイスで起きるこの現象ですが、そういう理由だったんですね。
まだiOSではCSSのみで対応できませんが、対応されたら上手く使いたいものです。
