Menu Hidden Behind Other Page Objects
-
My menu is being hidden behind a video in:
Firefox (on PC)
and IENot sure why. I’ve tried to make the containing boxes have a higher x-index. Nothing I seem to do is working.
-
Try setting a high z-index in your menu’s css file …
You’re using the black skin, so it’s located in skins/black.css.
Just take a line like this:
#dc_jqmegamenu_widget-%ID%-item {font: normal 13px Arial, sans-serif; line-height: 16px;}And make it this:
#dc_jqmegamenu_widget-%ID%-item {font: normal 13px Arial, sans-serif; line-height: 16px; z-index: 50;}And repeat for everything in the .css file. At least that’s what I did to get it to appear over my videos and sliders.
It’s a good plugin, although I’m curious as to how you got yours to look good in IE; mine doesn’t at all … I’m going to have to check out your .css. And your video plugin wasn’t working on IE 8, on test I ran.
Hang on … I see the issue now; I’m having the same issue with YouTube videos. The Z-Index thing is supported in all major browsers …
IE 8 requires you to use !DOCTYPE at the top of your header …
I tried changing this:
/* Reset code to remove theme inherent styling */ .dcjq-mega-menu ul.menu ul, .dcjq-mega-menu ul.menu li { list-style: none; padding: 0; margin: 0; }to this:
/* Reset code to remove theme inherent styling */ .dcjq-mega-menu ul.menu ul, .dcjq-mega-menu ul.menu li { list-style: none; padding: 0; margin: 0; z-index:50; }for each and every element in skins/black.css
Maybe I’ll try putting the z-index to 100 million or something. But first, I’m doing to try to google a solution, and I’ll post here when I’m finished.
Okay … it has something to do … you have to find a way to put this into your YouTube video plugin. I’m using Featured Videos Plus … so I’m looking for a solution for myself.
I don’t know what plugin you’re using … but you might have to hardcode this in at the end of the video string:
wmode=”opaque”
I’m downloading your plugin to see where this can be done in the settings.
Are you using http://ww.wp.xz.cn/extend/plugins/youtube-channel-showcase/?
– Yes that is the plugin I am using.
– I tried hardcoding the “&wmode=”opaque”” into the plugin in this section, but it didn’t seem to do anything.
if (isset($_GET['entry'])) { $iframe_src = 'http://www.youtube.com/v/' . $_GET['entry'] . '?version=3&f=videos&app=youtube_gdata&autoplay=1'; } else { $iframe_src = 'http://www.youtube.com/v/' . $showcase . '?version=3&f=videos&app=youtube_gdata&autoplay=1'; }– I have a doctype at the top of my header.
– The video plugin works fine for me in IE8 (granted I’m using IE9 in IE8 mode). The only problem I have with IE8 is the menu going behind the video.
– I tried adding “z-index:50px;” to everything in the black.css and it also did not work (so I’ve removed it)
Okay … I confess that I looked on your .org profile and checked out your website. On a side note, I grew up playing hockey in all provinces, and have played in Kamloops, Trail, Pendicton, and Victoria … small world.
Anyway, I got mine to work. I just need to download this plugin and look at it. Don’t give up on this plugin just yet! I’m sure we can get it to work.
I’m primarily an SEO guy, but I know that once I download this plugin, we’ll find a way to make things work. I’ll have to install it on my site and play around with it. I’ll also look at your source code to see how you’ve implemented it … if there’s a .css in there, javascript file, or whatever … I’ll figure it out.
I messaged you on your company’s FB page. Go ahead and add me, if you’d like, so we can communicate real-time, instead of inundating the .org forums with our personal conversation.
And btw, it’s not:
z-index:50px;
it’s
z-index:50;
No pixels! But I just tried this in firebug live, to no avail … and you can assign a z-index:-1; to something if necessary … but I’m done w/ work, going home, so I’ll download this and get to work on it and use it on my site.
Still trying to figure this out … as a temporary fix, just put some text there to push the video down, and maybe a couple of
‘s … until we can figure out a proper solution.I also just noticed this does not work on the ipad AT ALL. So I might be looking for another plugin entirely.
Okay, So I am going to switch my video plugin to this one:
http://ww.wp.xz.cn/extend/plugins/youtube-channel-gallery/
It pretty much does all the same stuff, AND the video is BEHIND the menu, so that solves that issue. Plus the video player works on the iPad.
THE. END.
Great find … works perfectly for me, too. Thanks for sharing!
The topic ‘Menu Hidden Behind Other Page Objects’ is closed to new replies.