有没有办法禁用右水平滚动,但允许左水平滚动?

时间:2017-03-17 20:45:08

标签: javascript

有没有办法禁用右侧水平滚动,但允许左侧水平滚动?

let touches = []
window.addEventListener('touchmove', event => {
  event.preventDefault()
}, false)

window.addEventListener('touchstart', event => {
  touches[0] = event.touches[0].pageX
}, false)

window.addEventListener('touchend', event => {
  touches[1] = event.changedTouches[0].pageX
}, false)

您似乎必须在preventDefault()事件中touchmove

1 个答案:

答案 0 :(得分:1)

touchmove返回touche列表

  1. touchmove事件对象具有触摸列表
  2. 获得第一次触摸,并在所有情况下防止默认。
  3. on move将新x值与旧x值进行比较
  4. 如果nx - ox> 0然后手动移动。
  5. 示例: http://codepen.io/anon/pen/LWQJvx

    var old_x = null;
    
    document.addEventListener('touchstart', function(e) {
      old_x = e.targetTouches[0].clientX;
    }, false); 
    
    document.addEventListener('touchcancel', function(e) {
      old_x = e.targetTouches[0].clientX;
    }, false); 
    
    
    document.addEventListener('touchmove', function(e) {
      var touch = e.touches[0];
      if (touch.clientX - old_x < 0 ) {
        document.body.scrollLeft +=  old_x - touch.clientX;
      }
      old_x = touch.clientX;
      e.preventDefault();
      return false;   
    }, { passive: false });