HTML在页面和Flash对象中同时滚动

HTML scrolls simultaneously in page and Flash object

本文关键字：滚动 对象 Flash HTML      更新时间：2023-09-26

我在div中有一个flash对象，当我滚动它时，它会缩放它的内容。问题是我的页面也会滚动，我不知道如何解决这个问题。当我在闪光灯上滚动时，我需要页面保持静止。

我试着添加这个

 flashContainer.bind('mousewheel DOMMouseScroll', function(e) {
                var scrollTo = null;
                if (e.type === 'mousewheel') {
                    scrollTo = (e.originalEvent.wheelDelta * -1);
                } else if (e.type === 'DOMMouseScroll') {
                    scrollTo = 40 * e.originalEvent.detail;
                }
                if (scrollTo) {
                    e.preventDefault();
                    $(this).scrollTop(scrollTo + $(this).scrollTop());
                }
            });

但是由于preventDefault，flash对象将不再缩放。

你有什么建议吗？

这可能对你有用：

$("element").hover(function(){
    var scrollT = $(document).scrollTop();
    $(document).on("scroll", function(e){
        $(document).scrollTop(scrollT);
    });
}, function(){
    $(document).off("scroll");
});

http://jsfiddle.net/ZFsDY/3/

几个月前我偶然发现了这个问题（我们用来管理滚动的旧方法在最新的浏览器上不起作用）。我不被允许发布它的代码，但这里有一些关于我们是如何做到的

与reyaner的回答一样，我们使用事件侦听和preventDefault（）来禁用浏览器自动滚动，并获取滚动值（但不使用scrollTop（））。一旦我们有了值，我们就会通过ExternalInterface将其发送到Flash。为了实现这一点，flash对象必须事先添加一个回调，一个可以由Javascript调用的flash方法。

我们在Flash和JS之间添加了一些额外的交互，这样只有当Flash有焦点时，滚动才会被锁定。

警告：所有浏览器对轮子的缩放比例并不相同，您可能会发现缩放速度可能会有所不同。为了解决这个问题，我们决定每次调度事件时始终使用固定的步骤，而不是按原样使用delta。

另一次尝试：

$("element").bind( 'mousewheel DOMMouseScroll', function ( e ) {
    var d = e.wheelDelta || -e.detail;
    var s;
    if(d < 0) s = 1;
    else s = -1;
    this.scrollTop += s * 30;
    e.preventDefault();
});

http://jsfiddle.net/ZFsDY/5/

相关文章：