フロントエンドアーカイブ

スマホのブラウザで横スクロールUIをスクロール中に縦方向にガタつくのをなんとかする

var content = document.getElementById('your selector is here!');

content.addEventListener('touchstart', function(event) {

this.allowUp = (this.scrollTop > 0);

this.allowDown = (this.scrollTop < this.scrollHeight - this.clientHeight);

this.slideBeginY = event.pageY;

});

content.addEventListener('touchmove', function(event) {

var up = (event.pageY > this.slideBeginY);

var down = (event.pageY < this.slideBeginY);

this.slideBeginY = event.pageY;

if ((up && this.allowUp) || (down && this.allowDown)) {

event.stopPropagation();

}

else {

event.preventDefault();

}

});