Question

我不希望我的网页滚动。我的宽度为100％的<body>，我将overflow设置为hidden，它通常有效。没有滚动条，没有鼠标滚轮/触摸板手势滚动。但如果我点击并拖动到任何地方，我仍然可以滚动。

臭虫是我有一个绝对定位的div，所以它在其父级之外，部分（有时完全）在屏幕外。由于一些原因，我现在无法解决这个问题。

这个小提琴说明了我的问题（我在webkit中看到它），http://jsfiddle.net/ax5x7/2/

在HTML中向右拖动几乎任何地方都会导致页面滑动。回去是因为没有滚动条很棘手，所以如果你误操作，那看起来很糟糕。

在这里找到一个与jQuery被弃用的disableSelection()相关的建议，但除非我做错了（我将它应用于正文以及所有孩子），它似乎并没有阻止这种行为。我还发现了一个几年前似乎没有令人满意的解决方案的问题。绑带有点笨拙，我宁愿不在一段时间内滚动到（0,0）。

Answer 1

这将有效，并且不会禁用文本选择：

$(document).on('scroll', function() {
  $(document).scrollLeft(0);
});

如果要禁用向下滚动，可以添加$(document).scrollTop(0);。

这是 jsFiddle

Answer 2

你可以试试这个，但它会破坏文字的选择：

$('html, body').on("mousedown", null, function(event) {
    return false;
});

http://jsfiddle.net/samliew/ThCJf/

Answer 3

对于纯粹的JS实现，至少在Chrome上没有让我感到不寒而栗：

function preventScroll(){
    var element = document.getElementById('my-element-id');
    element.onscroll = function(){
      element.scrollLeft = 0;
    };
}

Answer 4

如果我理解你的问题，就应该这样做。

http://jsfiddle.net/ax5x7/3/

请随时告诉我有关此问题的更多信息，我会相应更新。

我删除了body标记上的填充/边距。

更新了biggestThing

看起来像这样：

#biggestThing {
    box-sizing: border-box;
    border: 1px solid black;
    width: 100%;
    background-color: #eee;
    height: 5em;
}

Answer 5

尝试在page_wrapper的css中添加overflow:hidden;。

当绝对定位的元素（部分）离开屏幕时，如何阻止鼠标拖动时的屏幕滚动？

5 个答案: