滚动子div滚动窗口，我该如何阻止？ [英] Scrolling child div scrolls the window, how do I stop that?

问题描述

我有一个带有滚动条的div，当它到达结尾时，我的页面开始滚动。无论如何我可以阻止这种行为吗？

解决方案

找到解决方案。

http://jsbin.com/itajok

<这是我需要的。

这就是代码。

http://jsbin.com/itajok/edit#javascript,html

使用jQuery插件。

---

因弃用通知而更新

来自 jquery-mousewheel ：

添加三个参数的旧行为（ delta ， deltaX 和 deltaY ）现在不推荐使用事件处理程序的
，并将在以后的
版本中删除。

然后，现在必须使用 event.deltaY ：

  var toolbox = $（'＃toolbox'），
 height = toolbox.height（），
 scrollHeight = toolbox.get（ 0）.scrollHeight; 
 
 toolbox.off（mousewheel）。on（mousewheel，function（event）{
 var blockScrolling = this.scrollTop === scrollHeight  -  height&& event。 deltaY< 0 || this.scrollTop === 0&& event.deltaY> 0; 
 return！blockScrolling; 
}）; 
  

演示

I have a div, with a scroll bar, When it reaches the end, my page starts scrolling. Is there anyway I can stop this behavior ?

解决方案

Found the solution.

http://jsbin.com/itajok

This is what I needed.

And this is the code.

http://jsbin.com/itajok/edit#javascript,html

Uses a jQuery Plug-in.

---

Update due to deprecation notice

From jquery-mousewheel:

The old behavior of adding three arguments (delta, deltaX, and deltaY) to the event handler is now deprecated and will be removed in later releases.

Then, event.deltaY must now be used:

var toolbox = $('#toolbox'),
    height = toolbox.height(),
    scrollHeight = toolbox.get(0).scrollHeight;

toolbox.off("mousewheel").on("mousewheel", function (event) {
  var blockScrolling = this.scrollTop === scrollHeight - height && event.deltaY < 0 || this.scrollTop === 0 && event.deltaY > 0;
  return !blockScrolling;
});

Demo

这篇关于滚动子div滚动窗口，我该如何阻止？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！