Question

我有一个可滚动的div名称，每当我将鼠标悬停在它上面时，我只想将滚动限制在此div，以便在到达div的顶部/底部后，滚动将粘贴到div。我使用了以下代码：

<div class="scrollable" style="overflow-y: scroll; height: 2px;" 
 onmouseover="document.body.style.overflow='hidden'" 
 onmouseout="document.body.style.overflow='auto'" >
   Some text<br>sometext<br>sometext 
</div>

这样做可以完成工作，但只有当主滚动条被隐藏时，网页看起来很奇怪每次我将鼠标悬停在'.scrollable'上

同样使用window.onwheel=function(){return false;}没有帮助，因为它阻止了任何元素的滚动。

是否有办法在保持主页面滚动条可见的同时，仅在悬停的div上启用滚动而不在其他div上滚动？

谢谢

Answer 1

您可以在不隐藏滚动条的情况下禁用滚动，请检查this帖子。

使用jQuery，这将导致：

$(".scroll").hover(function() {
  var oldScrollPos = $(window).scrollTop();

  $(window).on('scroll.scrolldisabler', function(event) {
    $(window).scrollTop(oldScrollPos);
    event.preventDefault();
  });
}, function() {
  $(window).off('scroll.scrolldisabler');
});

检查it。

Answer 2

对我来说，希望可以工作

auto lam = ...

如何限制滚动到鼠标当前正在悬停的div？

2 个答案: