javascript - 如何使用 Javascript 检测浏览器窗口何时横向滚动

Question

如何使用 Javascript/Jquery 在浏览器窗口中测试横向/水平滚动，然后在检测到移动时执行操作？

Answer 1

您可以绑定(bind)到窗口scroll事件并使用最后一个scrollLeft位置来确定它是否已更改。

var lastPosition = 0,
    doc = $(document),
    win = $(window);

win.scroll(function() {
  var scrollPosition = doc.scrollLeft();
  
  if(lastPosition != scrollPosition) {
    lastPosition = scrollPosition;
    console.log('scroll left changed!');
  }
});

.container {
  border: 1px solid #000;
  height: 50px;
  width: 10000px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="container">
 hello
<div>

普通 JS

var lastPosition = 0;

window.addEventListener('scroll', function(){
  var scrollPosition = this.pageXOffset;

  if(lastPosition != scrollPosition) {
    lastPosition = scrollPosition;
    console.log('scroll left changed!');
  }
});