21288 Posts in 5733 Topics by 2602 members
|
Page:
1
|
Go to End | |
| Author | Topic: | 1853 Views |
-
drop down menu shows behind flash banner
28 September 2010 at 6:45am Last edited: 28 September 2010 8:00am
Hi,
I know this is probably not silverstripe specific, but anyhow,
I am using the superfish dropdown menu with silverstripe , and I have a flash banner-slideshow on the home page,
In firefox everything works great, however in safari (win) and ie the dropdown menu goes behind the flash banner,
I initially had to remove the rounded corners in the css of the dropdown portion to get it going on top in firefox.I used this great silverstripe tutorial to incorporate flashcontent (including alt content for ipads etc.) http://www.ssbits.com/embed-flash-content-using-swfobject/
and,,, what else, I have a high z-index for the flash as well as a higher z-index for the menu. the menu gets read in before the flash gets read in.
The flash slideshow sits ontop of a slideshow-background-image (which the dropdown goes on top of fine, just the flash portion that is the problem).I also tried this - setting position relative for the containing divs; : http://webdemar.com/webdesign/superfish-jquery-menu-ie-z-index-bug/
reference:
http://www.livestockgentec.com/would be great if anyone has had the same problems and knew whats missing, and when I get better at silverstripe hopefully I can pay it back and help someone else out.
thanks,
and thanks for silverstripe! -
Re: drop down menu shows behind flash banner
28 September 2010 at 8:24am
ok,
I found the solution, and I am sure other people will or have run into same problem, so I am posting,The solution was here:
http://simonbingham.posterous.com/problem-with-superfish-menu-being-hidden-behi
i.e. you have to set window mode to transparent for the flashcontent for the superfish dropdown menu to not be hidden underneath the flash.so when using the great tutorial from ssbits on how to incorporate flashcontent (and alt content) into silverstripe - it will give you this code:
/* <![CDATA[ */
swfobject.embedSWF(
"/assets/myflashfile.swf",
"FlashContainer",
"950", "310",
"9.0.0",
"mysite/javascript/lib/expressInstall.swf"
);
/* ]]> */You then have to add a flash variable to make it transparent and it should end up like this:
var flashvars = {};
var params = {wmode:"transparent"};
var attributes = {};
/* <![CDATA[ */
swfobject.embedSWF(
"/assets/myflashfile.swf",
"FlashContainer",
"950", "310",
"9.0.0",
"mysite/javascript/lib/expressInstall.swf",
flashvars, params, attributes);
/* ]]> */
| 1853 Views | ||
|
Page:
1
|
Go to Top |
