Question

我知道还有一些与此相关的问题（包括我之前的一些问题），但我正在寻找一种方法来改进我发现的唯一解决方案。

我试图制作它，以便我可以使用鼠标滚轮滚动高度限制overflow: scroll; <div>，以及<div>时继续工作的滚轮}包含在<div>中，其内容来自AJAX调用。

在我的网上旅行中，我偶然发现了这个小提琴：http://jsfiddle.net/mrtsherman/eXQf3/33/。不幸的是，当从AJAX调用调用数据时，我无法使用它 - 我不知道为什么会发生这种情况，所以如果有人意识到这个问题，我会很感激一些建议！

我已经离开了一点主题，因为我的问题与我发现至少有效的唯一解决方案有关：onmouseover class adding。

DIV

<div onmouseover="$('html').addClass('noscroll');" 
     onmouseout="$('html').removeClass('noscroll');" 
     style="overflow:auto;max-height: 200px;">Data that is long</div>

CSS类

html.noscroll
{
    position: fixed; 
    overflow-y: scroll;
    width: 100%;
}

我一直在使用这段代码，认为它完美无缺，但是我发现在较小的显示器上它会引发一个更烦人的问题：跳回到屏幕顶部！

似乎当position: fixed;被触发时它会禁用滚动条并使其保持可见（我想要的）但它也会将滚动条一直移动到顶部，因为我的可滚动div是一半在页面下方，它无法使用。

Answer 1

对于这部分：

不幸的是，当从AJAX调用调用数据时我无法使用它 - 我不知道为什么会这样，所以如果有人知道这个问题，我会很感激一些建议！

您需要更改一些代码：

$('#abs').on('mousewheel', function(e) {

After changes

bind仅适用于存在的元素，无法通过ajax附加到元素上。来自jQuery网站：

从jQuery 1.7开始，.on（）方法是首选方法将事件处理程序附加到文档。对于早期版本， .bind（）方法用于直接将事件处理程序附加到元素。处理程序附加到当前选定的元素中 jQuery对象，因此这些元素必须存在于调用点到.bind（）发生。有关更灵活的事件绑定，请参阅讨论 .on（）或.delegate（）中的事件委托。

锁定div在鼠标悬停时滚动，但保持位置

1 个答案: