Pages

Sunday, August 28, 2011

How to Fix pop-overs from overlapping embeded flash ?

The Problem:
When using  “modal popup ajax control”, it is overlapped by flash elements.



The Solution:

The default behavior for embeded flash always overlap any sort of HTML attempting to be layered on top of it. Fixing that so that pop-over appear correctly above the flash requires an easy modification to the flash videos embed code on the website.


There are two elements you need to add to your video code to override this issue.
Step 1:
Add <param name="wmode" value="opaque" /> directly after your opening "object" tag.

Step 2:
Add wmode="opaque" within your "embed" tag.

Here is an example of how your video code might look with the fix in place:
<object width="425" height="344">
<param name="wmode" value="opaque" />
<param name="movie" value=http://www.youtube.com/v/[XXXX]></param>
<param name="allowFullScreen" value="true"></param>
<embed wmode="opaque" src=http://www.youtube.com/v/[XXXX] type="application/x-shockwave-flash" allowfullscreen="true" width="425" height="344"></embed>
</object>


 

Still Have Questions?

If you still have questions, add it to the comments below or email  me