关于嵌套在页面中的Flash中MouseWheel事件和页面滚动冲突的问题。

时间:2022-07-16 04:52:53
若页面比较长,有垂直滚动条。而其中嵌入了一个Flash,此flash是地图控件,可鼠标滚动缩放地图,但是若在flash中滚动鼠标,则也同时滚动了页面。有没有不滚动页面,而只滚动flash的方法。
我在flex里用
e.stopPropagation()
e.preventDefault()
都不管用。
而TextArea,在出现滚动条时,是可以捕获鼠标滚轮事件,而不再冒泡到浏览器的。
我分析一下事件流。鼠标操作==》浏览器响应(但未滚动页面)==》Flash(DOM2)==>浏览器(滚动页面)。应该可以做到,但是不知道textArea怎么实现的。

5 个解决方案

#1


提供给你一下用ExternalInterface调用javascript的解决方案,在触发MouseWheel时用javascript控制禁止浏览器的滚动,在MouseWheel结束时启用浏览器的滚动:

1.在页面中嵌入javascript
 ExternalInterface.call("eval", "var browserScrolling;function allowBrowserScroll(value){browserScrolling=value;}function handle(delta){if(!browserScrolling){return false;}return true;}function wheel(event){var delta=0;if(!event){event=window.event;}if(event.wheelDelta){delta=event.wheelDelta/120;if(window.opera){delta=-delta;}}else if(event.detail){delta=-event.detail/3;}if(delta){handle(delta);}if(!browserScrolling){if(event.preventDefault){event.preventDefault();}event.returnValue=false;}}if(window.addEventListener){window.addEventListener('DOMMouseScroll',wheel,false);}window.onmousewheel=document.onmousewheel=wheel;allowBrowserScroll(true);");


2.方法调用
ExternalInterface.call("allowBrowserScroll", allow);

其中“allow”是传递的Boolean值,决定是否启用浏览器页面滚动。

#2


在js里加是不合理的,因为swf的容器不一定是浏览器,可以监听滚轮事件,当执行的时候就return false

#3


如果是浏览器,用JS最简单,若是其他的,还是按2楼方法吧

#4


不想多说,免得口水战。
合理不合理,既要考虑主观又要考虑客观,不要武断,用事实说话。如果说错了,触犯到哪位,还请多包涵。

我还是提供给楼主一个完整的类实现吧:
package
{
    import flash.display.Stage;
    import flash.events.Event;
    import flash.events.MouseEvent;
    import flash.external.ExternalInterface;
    import mx.core.Application;

    public class MouseWheelTrap {
static private var _mouseWheelTrapped :Boolean;
public static function setup(stage:Stage):void 
{

mx.core.FlexGlobals.topLevelApplication.addEventListener(MouseEvent.ROLL_OVER, function():void
    { 
        allowBrowserScroll(false); 
    }
    );

mx.core.FlexGlobals.topLevelApplication.addEventListener(MouseEvent.ROLL_OUT, function():void 
    { 
        allowBrowserScroll(true); 
    }
    );
}

private static function allowBrowserScroll(allow:Boolean):void
{
    createMouseWheelTrap();
    if (ExternalInterface.available) 
    {
        ExternalInterface.call("allowBrowserScroll", allow);
    }
}
private static function createMouseWheelTrap():void
{
    if (_mouseWheelTrapped) {return;} _mouseWheelTrapped = true; 
    if (ExternalInterface.available)
    {
        ExternalInterface.call("eval", "var browserScrolling;
function allowBrowserScroll(value){browserScrolling=value;}function handle(delta){if(!browserScrolling){return false;}return true;}function wheel(event){var delta=0;if(!event){event=window.event;}if(event.wheelDelta){delta=event.wheelDelta/120;if(window.opera){delta=-delta;}}else if(event.detail){delta=-event.detail/3;}if(delta){handle(delta);}if(!browserScrolling){if(event.preventDefault){event.preventDefault();}event.returnValue=false;}}if(window.addEventListener){window.addEventListener('DOMMouseScroll',wheel,false);}window.onmousewheel=document.onmousewheel=wheel;allowBrowserScroll(true);");
    }
}
    }

}

#5


多谢大家,有个swfWheel东西。我试过,但我这无效。我屏蔽了滚轮,绕过去了。

#1


提供给你一下用ExternalInterface调用javascript的解决方案,在触发MouseWheel时用javascript控制禁止浏览器的滚动,在MouseWheel结束时启用浏览器的滚动:

1.在页面中嵌入javascript
 ExternalInterface.call("eval", "var browserScrolling;function allowBrowserScroll(value){browserScrolling=value;}function handle(delta){if(!browserScrolling){return false;}return true;}function wheel(event){var delta=0;if(!event){event=window.event;}if(event.wheelDelta){delta=event.wheelDelta/120;if(window.opera){delta=-delta;}}else if(event.detail){delta=-event.detail/3;}if(delta){handle(delta);}if(!browserScrolling){if(event.preventDefault){event.preventDefault();}event.returnValue=false;}}if(window.addEventListener){window.addEventListener('DOMMouseScroll',wheel,false);}window.onmousewheel=document.onmousewheel=wheel;allowBrowserScroll(true);");


2.方法调用
ExternalInterface.call("allowBrowserScroll", allow);

其中“allow”是传递的Boolean值,决定是否启用浏览器页面滚动。

#2


在js里加是不合理的,因为swf的容器不一定是浏览器,可以监听滚轮事件,当执行的时候就return false

#3


如果是浏览器,用JS最简单,若是其他的,还是按2楼方法吧

#4


不想多说,免得口水战。
合理不合理,既要考虑主观又要考虑客观,不要武断,用事实说话。如果说错了,触犯到哪位,还请多包涵。

我还是提供给楼主一个完整的类实现吧:
package
{
    import flash.display.Stage;
    import flash.events.Event;
    import flash.events.MouseEvent;
    import flash.external.ExternalInterface;
    import mx.core.Application;

    public class MouseWheelTrap {
static private var _mouseWheelTrapped :Boolean;
public static function setup(stage:Stage):void 
{

mx.core.FlexGlobals.topLevelApplication.addEventListener(MouseEvent.ROLL_OVER, function():void
    { 
        allowBrowserScroll(false); 
    }
    );

mx.core.FlexGlobals.topLevelApplication.addEventListener(MouseEvent.ROLL_OUT, function():void 
    { 
        allowBrowserScroll(true); 
    }
    );
}

private static function allowBrowserScroll(allow:Boolean):void
{
    createMouseWheelTrap();
    if (ExternalInterface.available) 
    {
        ExternalInterface.call("allowBrowserScroll", allow);
    }
}
private static function createMouseWheelTrap():void
{
    if (_mouseWheelTrapped) {return;} _mouseWheelTrapped = true; 
    if (ExternalInterface.available)
    {
        ExternalInterface.call("eval", "var browserScrolling;
function allowBrowserScroll(value){browserScrolling=value;}function handle(delta){if(!browserScrolling){return false;}return true;}function wheel(event){var delta=0;if(!event){event=window.event;}if(event.wheelDelta){delta=event.wheelDelta/120;if(window.opera){delta=-delta;}}else if(event.detail){delta=-event.detail/3;}if(delta){handle(delta);}if(!browserScrolling){if(event.preventDefault){event.preventDefault();}event.returnValue=false;}}if(window.addEventListener){window.addEventListener('DOMMouseScroll',wheel,false);}window.onmousewheel=document.onmousewheel=wheel;allowBrowserScroll(true);");
    }
}
    }

}

#5


多谢大家,有个swfWheel东西。我试过,但我这无效。我屏蔽了滚轮,绕过去了。