当设置不透明度时,Flash会在HTML元素下接收鼠标事件

时间:2010-03-27 15:35:14

标签: html css flash mouseevent opacity

我有一个带有Flash对象的HTML文档,上面有一个绝对定位的HTML元素。如果我将HTML元素的opacity CSS属性设置为小于1的任何值,则Flash对象(实际上已覆盖)将接收鼠标事件。使用纯HTML元素无法重现此问题。此外,Flash只接收悬停事件,因此我无法点击图层下方。

我在网上放了demonstration of the problem

我在Mac和Windows的Firefox 3.6,Safari 4.0和Chrome 5.0中都有这种行为。安装了Flash插件版本10。

是错误还是正常的预期行为?如果是后者,那么当它被半透明层覆盖时,如何阻止Flash接收事件?

5 个答案:

答案 0 :(得分:1)

非常有趣的问题,我搜索得很远,只找到了Actionscript解决方案。我甚至在本地重现了这个页面并尝试在闪光灯和面板之间放置一块砖墙,但是闪光灯总会响应鼠标事件。不幸的是,我唯一的解决方案是,当面板出现在屏幕上时,用图像移动/替换闪光灯,我希望你需要一个覆盖整个地图的面板。如果你只是有一些导航滑过一些闪光灯然后用图像替换它可能会被证明是回避。下面是使用jquery的代码,这是我能想到的最好的,尽管当你走出面板时会有点眨眼。

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $(".panel").mouseover(function() {
        $("#google-visualization-geomap-0").css({'position' : 'absolute', 'left' : '-999em'});
    });
    $(".panel").mouseout(function() {
        $("#google-visualization-geomap-0").css({'position' : 'static', 'left' : '0'});
    });
});
</script>

希望这有点帮助。

答案 1 :(得分:0)

在舞台上聆听Event.MOUSE_LEAVE。只要鼠标离开舞台就会被触发(将鼠标悬停在另一个html元素上会触发这个)。然后,您可以从不应该拥有它的任何东西中删除悬停状态。

答案 2 :(得分:0)

gravityone,

我遇到了同样的问题,下拉菜单重叠了我编程的闪光片。听起来你发现了一些ActionScript解决方案?任何意见都将不胜感激。

我测试了Event.MOUSE_LEAVE监听器,不幸的是它没有区分鼠标直接在swf上与在swf上方的菜单之上。

谢谢!


更新

所以我通过强制我的Flash片段在执行翻转效果之前检查javscript变量来解决这个问题。

要了解有关swf / js通信的更多信息,请在此处查看: link text

或者看看我是如何应用它的,请看下面的内容:

的ActionScript:

import flash.external.ExternalInterface;
private var navOver:Boolean;
private function onPackOver(event:MouseEvent){
    //Establish if Nav is on by grabbing js variable.
    navOver = ExternalInterface.call("navOnStatus");
    if (!navOver){
    // mouse over effects
    }
}

使用Javascript:

//navOn Variable is changed to true when mouse if over the nav, and false when it is not;
var navOn = false;
function navOnStatus(){
return navOn;
}

答案 3 :(得分:0)

也许应该将其视为浏览器错误。

对于使用Flash Player 10.1 r53的Google Chrome 5.0.375.99和Apple Safari 5.0(6533.16),我不再遇到此问题。我得到了预期的行为,即半透明层后面的Flash对象不响应鼠标事件。

答案 4 :(得分:-1)

从我的演示中可以看出,Flash对象仅在鼠标进入左侧面板时保留悬停事件 - 一旦在左侧面板上,Flash对象不再接收悬停事件,否则“巴西”例如,“弹出窗口”将继续跟随鼠标。 这种行为似乎是因为鼠标没有正确“离开”flash对象。 如果您不介意我问,为什么左侧面板会部分遮盖地图?