I am focusing on this site: http://www.oklahomainsightstv.com/ and I am looking to get the navigation drop lower to exhibit on The surface of the video object. I have attempted a couple of versions of z-index within the CSS but nothing has labored.

This really is my code:

<div id="hero" style="z-index:-1; position:relative;">

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="437" height="266" id="viddler_e3f5a526"><param name="movie" value="http://www.viddler.com/simple/e3f5a526/" /><param name="wmode" value="transparent" /><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="true" /><embed src="http://www.viddler.com/simple/e3f5a526/" width="437" height="266" type="application/x-shockwave-flash" allowScriptAccess="always" allowFullScreen="true" name="viddler_e3f5a526"></embed></object>

</div>

Its a browser bug ! Expensive, iframes are visible over the menu. Place video object not even close to recption menus.

Without testing it myself, a fast search says you will find a couple of things you will possibly not do:

  1. Add the wmode parameter for your video object and employ the worthiness "transparent": <param name="wmode" value="transparent" />
  2. Make certain you specify the position:relative; style towards the menu using the z-order. Otherwise, the z-order will not be used.

In the event that does not work, you might have experienced a limitation of the given browser, by which situation, you might want to design the website to ensure that plug ins not have the chance to overlap.

Sources