Question

那是我的完整js代码：

//init hammer function
var element=document.getElementById('pinwall-grid');
var hammertime=Hammer(element).on("drag", function(event) {
  direction=event.gesture.direction;
  if(direction == 'left')
  {
    var $meN=$('.pinwall-grid .ctrl a.next');

    if(!$meN.hasClass("nextD"))
    {
      $meN.trigger('click');
    }

    console.log('left');
  }
  else if(direction == 'right')
  {
    var $meP=$('.pinwall-grid .ctrl a.prev');

    if(!$meP.hasClass("prevD"))
    {
      $meP.trigger('click');
    }

    console.log('right');
  }
  else if(direction == 'up')
  {
    window.scroll({
      top: (window.innerHeight/2),
      left: 0,
      behavior: 'smooth'
    });

    console.log('down')
  }
  else if(direction == 'down')
  {
    window.scroll({
      top: (window.innerHeight/ -2),
      left: 0,
      behavior: 'smooth'
    });

    console.log('up')
  }

  event.gesture.stopDetect();
});

这里的问题是，当你向上或向下滑动时，它只会滚动一次，但是当我添加一个静态值（如-300而不是( window.innerHeight / -2 )）时，它的效果非常好。

任何想法每次向上或向下滑动时我可以使用什么代替( window.innerHeight / 2 )来滚动50vh。

注意：我添加了console.log以检查每次向下或向上滑动时是否正在读取代码，它是。

我想这是一个测量问题。

检查http://86.62.248.112/en/（手机上的最新新闻滑块），看看我在说什么

Answer 1

window.scroll将文档滚动到指定位置。在那里，重复相同的滚动请求应该没有效果。

window.scrollBy滚动指定的金额。结束位置相对于起始位置，重复调用应继续滚动（如果文档足够大）。

我认为在调用window.scroll时使用的“向滚动位置添加静态值”意味着您更新了滚动到位置 - 结果是文档按添加的数量滚动。

尝试使用window.scrollBy。

如何在window.innerheight

1 个答案: