iScroll 4 で左右にスクロールさせつつ、上下にはネイティブでスクロールさせる方法
スマホで独自のスクロールエリアといえば iScroll 4 は定番ですが、画面の大部分を覆うような横スクロールエリアを持つレイアウトの場合、縦に長いページを上下にネイティブスクロールできなくなります。
そういうときは、onBeforeScrollStart() をオーバーライドして iScroll 4 の e.preventDefault() を無効にした上で、onBeforeScrollMove() で横スクロールのみ e.preventDefault() すれば、意図が実現できます。e.preventDefault() の実装位置は、iScroll 4 のバージョンによって違うらしいので、注意！
var myScroll = new iScroll(
'wrapper',
{
hScroll: true,
vScroll: false,
hScrollbar: false,
onBeforeScrollStart: function(e) {
// cancel e.preventDefault()
},
onBeforeScrollMove: function(e) {
if (this.absDistX > (this.absDistY + 5)) {
e.preventDefault();
}
}
}
);