如何确保DOM元素在包含Flash对象时触发鼠标悬停

时间:2021-05-11 21:38:01

I have a div that contains several child elements, one of which is a flash movie.

我有一个包含几个子元素的div,其中一个是flash电影。

When rolling over this div, I want it to change style to indicate it is rolled over. My problem is that the mouseover and mouseout javascript events don't always trigger, especially if the user moves the mouse over the flash element too quickly.

滚动这个div时,我希望它改变样式以表明它已被翻转。我的问题是mouseover和mouseout javascript事件并不总是触发,特别是如果用户将鼠标移动到flash元素上太快。

Any suggestions for how I can ensure that a mouseover event always get triggered.

有关如何确保始终触发鼠标悬停事件的任何建议。

I can't add an event to the flash movie itself because it is proprietary code that I don't have the source for.

我无法向flash电影本身添加一个事件,因为它是我没有源代码的专有代码。

Also I can't cover the flash movie in a div/image because I need rollover and click events to occur within the flash itself.

此外,我无法在div / image中覆盖flash影片,因为我需要在flash中自动进行翻转和单击事件。

3 个解决方案

#1


2  

Change the wmode parameter of the object/embed tag to opaque.

将object / embed标记的wmode参数更改为opaque。

Your code should look something like the following.

您的代码应如下所示。

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia
.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="800" height="600">
    <param name="movie" value="movie.swf">
    <param name="wmode" value="opaque">
    <embed src="movie.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="800" height="600"></embed>
</object>

#2


1  

What you could do is cover the flash element with an invisible div. Place your onmouseover handler on that div, and add a line to the handler to hide the covering div. At the same time, add an onmouseover function to the window - this should get triggered when the mouse leaves the flash element. (I hope).

你可以做的是用一个看不见的div覆盖flash元素。将onmouseover处理程序放在该div上,并在处理程序中添加一行以隐藏覆盖div。同时,在窗口中添加一个onmouseover函数 - 当鼠标离开flash元素时应该触发。 (我希望)。

  1. There's a <div> covering your flash.
  2. 有一个

    覆盖你的闪光灯。

  3. When the user mouses over it:
    1. It calls whatever function it needs to do.
    2. 它调用它需要做的任何功能。

    3. It hides itself, allowing normal interaction with the SWF.
    4. 它隐藏自身,允许与SWF进行正常交互。

    5. It places a mouseover function on the window which will:
      1. Show the original div again.
      2. 再次显示原始div。

      3. Calls your "mouseout" function.
      4. 调用你的“mouseout”功能。

      5. Removes the window.onmouseover function.
      6. 删除window.onmouseover函数。

    6. 它在窗口上放置了一个鼠标悬停功能,它将:再次显示原始div。调用你的“mouseout”功能。删除window.onmouseover函数。

  4. 当用户将鼠标悬停在它上面时:它会调用它需要做的任何功能。它隐藏自身,允许与SWF进行正常交互。它在窗口上放置了一个鼠标悬停功能,它将:再次显示原始div。调用你的“mouseout”功能。删除window.onmouseover函数。

#3


0  

The simple answer is you can't, given your constraints.

简单的答案是你不能,考虑到你的约束。

The complex answer you seem to know already. The flash movie runs in a sandbox that doesn't trigger regular DOM events. If you want to trigger mouse events in the flash, you can't cover it up with DOM elements. If you don't have access to the source of the flash movie, you can't build "bridges" to the JS world.

您似乎已经知道的复杂答案。 Flash影片在沙箱中运行,不会触发常规DOM事件。如果要在闪存中触发鼠标事件,则无法用DOM元素覆盖它。如果您无法访问Flash影片的源代码,则无法构建JS世界的“桥梁”。

I think you have a no-win situation.

我认为你有一个不赢的局面。

#1


2  

Change the wmode parameter of the object/embed tag to opaque.

将object / embed标记的wmode参数更改为opaque。

Your code should look something like the following.

您的代码应如下所示。

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia
.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="800" height="600">
    <param name="movie" value="movie.swf">
    <param name="wmode" value="opaque">
    <embed src="movie.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="800" height="600"></embed>
</object>

#2


1  

What you could do is cover the flash element with an invisible div. Place your onmouseover handler on that div, and add a line to the handler to hide the covering div. At the same time, add an onmouseover function to the window - this should get triggered when the mouse leaves the flash element. (I hope).

你可以做的是用一个看不见的div覆盖flash元素。将onmouseover处理程序放在该div上,并在处理程序中添加一行以隐藏覆盖div。同时,在窗口中添加一个onmouseover函数 - 当鼠标离开flash元素时应该触发。 (我希望)。

  1. There's a <div> covering your flash.
  2. 有一个

    覆盖你的闪光灯。

  3. When the user mouses over it:
    1. It calls whatever function it needs to do.
    2. 它调用它需要做的任何功能。

    3. It hides itself, allowing normal interaction with the SWF.
    4. 它隐藏自身,允许与SWF进行正常交互。

    5. It places a mouseover function on the window which will:
      1. Show the original div again.
      2. 再次显示原始div。

      3. Calls your "mouseout" function.
      4. 调用你的“mouseout”功能。

      5. Removes the window.onmouseover function.
      6. 删除window.onmouseover函数。

    6. 它在窗口上放置了一个鼠标悬停功能,它将:再次显示原始div。调用你的“mouseout”功能。删除window.onmouseover函数。

  4. 当用户将鼠标悬停在它上面时:它会调用它需要做的任何功能。它隐藏自身,允许与SWF进行正常交互。它在窗口上放置了一个鼠标悬停功能,它将:再次显示原始div。调用你的“mouseout”功能。删除window.onmouseover函数。

#3


0  

The simple answer is you can't, given your constraints.

简单的答案是你不能,考虑到你的约束。

The complex answer you seem to know already. The flash movie runs in a sandbox that doesn't trigger regular DOM events. If you want to trigger mouse events in the flash, you can't cover it up with DOM elements. If you don't have access to the source of the flash movie, you can't build "bridges" to the JS world.

您似乎已经知道的复杂答案。 Flash影片在沙箱中运行,不会触发常规DOM事件。如果要在闪存中触发鼠标事件,则无法用DOM元素覆盖它。如果您无法访问Flash影片的源代码,则无法构建JS世界的“桥梁”。

I think you have a no-win situation.

我认为你有一个不赢的局面。