• Registered: 2013-07-18
  • Posts: 3

Topic: CSS menu hides behind autoviewer

On my website I use a series of autoviewers which open in an iframe. It is an autoviewer I downloaded probably 3-4 years ago, but i'm not sure which version it actually is. It still works fine for my needs, besides this 1 problem. For some reason when I updated the menu at the top of my page... (I used a free CSS menu creator I found online)... it drops down behind the autoviewer. It's not the div the iframe is in and I don't think it's the iframe itself so only other thing it could be is the autoviewer. Does anyone have any idea what I can try? It's beyond frustrating at this point. Thanks

  • Registered: 2008-07-06
  • Posts: 6,334

Re: CSS menu hides behind autoviewer

Try giving your menu div a higher z-index value than the div your iframe is in (to ensure that your menu is stacked on top of your gallery).

Also, try making the background of your gallery transparent. Please see this forum post for details.
You will also need to add the allowtransparency="true" attribute to your iframe tag (for Internet Explorer browsers), e.g.:

<iframe src="gallery/index.html" width="800" height="600" frameborder="0" scrolling="no" allowtransparency="true"></iframe>

If you continue to experience difficulties, please post the URL to your web page so that I can take a look.

Steven Speirs
SimpleViewer Support Team
  • Registered: 2013-07-18
  • Posts: 3

Re: CSS menu hides behind autoviewer

Thanks for the reply... i'm kind of a novice so sorry if this is kind of a dumb question... but where would I paste the code to make the gallery transparent? Within the code on the webpage which has the iframe?, or one of the actual files for the gallery?

Also... I messed with the z-index before and didn't work and copied the allowtransparency="true" attribute into my page but that didn't work either.

  • Registered: 2008-07-06
  • Posts: 6,334

Re: CSS menu hides behind autoviewer

where would I paste the code to make the gallery transparent? Within the code on the webpage which has the iframe?, or one of the actual files for the gallery?

The fo.addParam("wmode", "transparent"); line of code should be added to the gallery's embedding code (immediately before the fo.write("flashcontent"); line) in the page that you are loading into your iframe (the gallery's own 'HTML index page).

Please post the URL to your web page so that I can take a look and help further.

Steven Speirs
SimpleViewer Support Team
  • Registered: 2013-07-18
  • Posts: 3

Re: CSS menu hides behind autoviewer

Sorry took me a few days to try out what you said and post a reply. I am happy to say that adding the fo.addParam("wmode", "transparent"); line of code is what was missing. So it's showing up in IE now. I was trying to figure that out for weeks. And it's a portfolio for applying for jobs so it's been a pain that it wasn't working in IE. .... seriously, if I could I would buy you a beer.

the link is www.michaellautner.com, but it won't be completely updated with the menu I was asking about until later this week. I need to finish adding it to a couple pages and then upload the files to the server. Thanks again.... you are a life saver! :D

  • Registered: 2008-07-06
  • Posts: 6,334

Re: CSS menu hides behind autoviewer

You're welcome!
I am glad that I was able to help.

Steven Speirs
SimpleViewer Support Team