Hi all,

 

I have an issue with Flash overlaying some HTML elements that are meant to display above it. I've researched solutions, however I'm not sure how to implement a fix into the existing code. Could someone please advise. My code is:

 

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="955" height="500" id="flashcontent">
       	<param name="wmode" value="transparent" />
           <param name="movie" value="/flash/banner.swf" />
           <!--[if !IE]>-->
           <object type="application/x-shockwave-flash" data="/flash/banner.swf" width="980" height="500">
           <!--<![endif]-->
               <img src="/images/banner.jpg" alt="TITLE" width="980" height="500" />
           <!--[if !IE]>-->
           </object>
           <!--<![endif]-->
       </object>

 

The fallback image is important for iPhone and iPad devices. A lot of the solutions I've read say I need to set 'wmode' as 'transparent' or 'opaque' within the embed tag, however my code doesn't use the embed tag. Could someone please advise

Edited June 7, 201214 yr by C A R

Some codes for flash have a nested embed tag inside the object tag and the emabed tag needs wmode="transparent" inside the embed tag, but forget that with your code. You have <param name="wmode" value="transparent" /> in the outer object tag and that should be OK for the flash, but you probably need to repeat it inside the second object tag.

 

You might need

position: relative; /*or position: absolute; if that suits your structure*/ 
z-index: -1;

in the outer object tag of the flash.

 

Sometimes, just belts and braces, I add a higher z-index into the other element that is affected (for instance a drop down menu that drops behind the flash)

position: relative; /*or position: absolute; if that suits your structure*/ 
z-index: 10;

although the position and z-index codes are usually only needed for javascript with the same overlapping problem.

Edited June 7, 201214 yr by Wickham

Some codes for flash have a nested embed tag inside the object tag and the emabed tag needs wmode="transparent" inside the embed tag, but forget that with your code. You have <param name="wmode" value="transparent" /> in the outer object tag and that should be OK for the flash, but you probably need to repeat it inside the second object tag.

 

You might need

position: relative; /*or position: absolute; if that suits your structure*/ 
z-index: -1;

in the outer object tag of the flash.

 

Sometimes, just belts and braces, I add a higher z-index into the other element that is affected (for instance a drop down menu that drops behind the flash)

position: relative; /*or position: absolute; if that suits your structure*/ 
z-index: 10;

although the position and z-index codes are usually only needed for javascript with the same overlapping problem.

 

ok thanks I'll give those solutions a try.