Question

我在html网页中使用滚动但问题是它在整个页面上工作但是我希望在我调用滚动函数的div上工作是我的代码

<script>
var startPos;

function init(){
  var scrollArea = document.getElementById('holder');
  scrollArea.addEventListener('touchstart', function(event){
    touchstartHandler(event);
  }, false);

  scrollArea.addEventListener('touchmove', function(event){
    touchmoveHandler(event);
  }, false);

  scrollArea.addEventListener('touchend', function(event){
    touchendHandler(event);
  }, false);
}

function touchstartHandler(e){
  startPos = e.touches[0].pageY;
}

function touchmoveHandler(e){
  var touch = e.touches[0];
  var targetBox = e.currentTarget.getElementsByTagName("div")[0];
  e.preventDefault();

  var fingerMoved = startPos - touch.pageY;
  startPos = touch.pageY;

  targetBox.scrollTop = targetBox.scrollTop + fingerMoved;
}
</script>

Answer 1

一个简单的解决方案，要切断整个页面的滚动。

设置CSS：

html, body{overflow:hidden;}
/* or */
html, body{overflow-y: hidden;}

这将完全消除您的页面滚动。然后只需在页面上设置要滚动的元素即可滚动。诚然，你甚至不需要javascript，但是javascript确实提供了更好的功能。

如何在整个页面上禁用滚动，除了html网页中的选定div

1 个答案: