相关疑难解决方法(0)

所以当我的灯箱打开时,我正试图在我的页面上禁用滚动,我发现这非常有用的脚本就是这样做的.(http://jsfiddle.net/mrtsherman/eXQf3/3/),不幸的是,当我在自己的页面上使用它时,它也禁止在我的灯箱中滚动.我开始使用警报调试代码,但发现event.wheelDelta在我的页面上返回"undefined",而在JSFiddle中,它返回-120.

例:

<div id="big">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<!-- ...and so on -->

"#big"绝对位于".small"的一部分后面,但不是父元素.

我一直这样做:

           var smallArray = [];

           var $big = $('#big');
           var $bigPos = $big.offset();

           $('div.small').each(function() {
                    var $this = $(this);
                    var $thisPos = $this.offset();

                    if(
                            $thisPos.left >= $bigPos.left &&
                            $thisPos.left <= $bigPos.left+$big.outerWidth() &&
                            $thisPos.top >= $bigPos.top &&
                            $thisPos.top <= $bigPos.top+$big.outerHeight()
                    ) smallArray.push($this);
            });

......但这似乎很糟糕.我是否错过了一些jQuery或vanilla JavaScript的方法,这些方法可以让我以更优雅高效的方式做到这一点？

非常感谢您提供的任何帮助.

我想知道是否可能以及如何将鼠标滚轮/滚动事件(用户的滚动尝试)从header转移到container.

我有以下示例情况:

+------------+     +------------+|
|   header   |     |   header   ||
+------------+     +------------+|
|           ||     |            ||
|           ||     |            ||
| container ||     | container  ||
|           ||     |            ||
|           ||     |            ||
+------------+     +------------+|
 situation 1        situation 2

情况

情境2是"传统"设置,其中可以滚动整个页面.当光标悬停标题时(即使它可能已修复),滚动尝试将传递给body/html.由于容器溢出body/html,如果用户旋转他/她的鼠标滚轮,容器将移动/滚动.由于标题是固定的,它将保持在相同的位置.

情况1是我的测试设置.容器的内容溢出容器,这将导致容器显示滚动条.现在我希望容器在用户的光标悬停在标题上并且用户旋转他/她的滚轮时也滚动.

更新1

情况的一个方面1

情况2的一个小问题

更新2

我创造了另一个小提琴来展示我的进步,这可能是解决方案,但我无法让它发挥作用.这可能会激励其他人获得实际的解决方案:)我得到错误:( (index):69 Uncaught InvalidStateError: Failed to execute 'dispatchEvent' on 'EventTarget': The event is already being dispatched. 现在它只是chrome中的滚动事件)

更新3

这与我预期的解决方案最接近, …