jQuery Multi Level CSS Menu #2

[jedmundson]

Just starting with this MENU code. Everything is working great except that the drop down menus are behind some of the graphics on the page. Is there a method to move the menus to the front of the other objects. thanks..

[azoomer]

it is usually a z-index thing. Try to give the graphic a z-index that is lower than that of the menu. A link to you page would help.

[jedmundson]

Thanks. I tried changing the Z-index for the layers in the CSS menu, set them to 3, but still the same problem.

[azoomer]

What is the black thing in your screenshot ? is is it a jpg image, an embedded youtube video or what is it exactly ? Does it have a specific ID or class ?

[jedmundson]

It is a .mov file on that page. Other pages do not have that type file and they work fine.

[azoomer]

Could you post a copy of the html on that page. Maybe that could help

[jedmundson]

Here take a look please.

http://66.140.153.225/usa/web-content/single.php#

[azoomer]

It looks fine in firefox and the menu goes above the .mov file, but i see the problem in chrome and safari. I internet explorer there some major differences to the whole page. Strange.
It looks like the #layer 1 2 3 4 5 are part of the menu and you might want to increase those ( maybe to 1000 or so, i mean the z-index). Another thing you can try is to add
<param name="wmode" value="opaque"></param>
and
wmode="opaque"
to the embedded object ( .mov). I know this helps with embedded youtube videos. Try like this:


<object class="dsR118" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" align="top">
<param name="palette" value="background" />
<param name="attr" value="value" />
<param name="scale" value="1" />
<param name="cache" value="true" />
<param name="src" value="Sinks/VR/SingleVR320.mov" />
<param name="autoplay" value="true" />
<param name="controller" value="true" />
<param name="wmode" value="opaque"></param>

<embed align="top" height="336" palette="background" pluginspage="http://www.apple.com/quicktime/download/" src="Sinks/VR/SingleVR320.mov" type="video/quicktime" wmode="opaque" width="320" controller="true" autoplay="true" cache="true" scale="1" attr="value">
</embed>
</object>

[jedmundson]

Thanks for the advise. It does not seem to change anything in Safari. You are right it does work in FireFox but the menu is still broken where it overlaps the mov file. I am going to make the mov files again with a white background and see if that changes anything.

[azoomer]

I see you tried the above but it doesn't really help. I'm sorry but this one is tricky

[jedmundson]

I am going to rethink the mov file location and format and see if that changes the condition. Thanks for the help.

[jedmundson]

If I change the code you sent me to

<param name="wmode" value="transparent"></>

it works.....

[azoomer]

You are right that works. Great

[jedmundson]

Changed the code you gave me to

<param name="wmode" value="transparent"></>

and it works.