CSS Z-index with flash?

[NewcastleFan]

Hey Guys.

 

I'm working on a tumblr theme at current and they have what is called a audio post, which ad's a flash movie that plays a sound.

 

I'm having trouble as I've got a fixed header that the posts go under as the user scrolls the page, which works fine with youtube videos.

 

However the audio post is going ontop of my banner/logo.

 

#banner {
width:637px;
height:150px;
margin-left:10px;
background-color:#141414;
background-repeat: no-repeat;
position:fixed;
z-index:1000;
}

.logo {
margin-top:40px;
z-index:1000;
position:fixed;
}

.audio_player {
z-index:-1000;
position:static;
}

 

<span id="audio_player_11436410709">
<div class="audio_player">
<embed type="application/x-shockwave-flash" src="http://assets.tumblr.com/swf/audio_player_black.swf?audio_file=http://www.tumblr.com/audio_file/11436410709/tumblr_lt297nLjGa1r4fuce&color=FFFFFF" height="27" width="207" quality="best"></div></span>

 

The embed is dynamically generated by tumblr so there is no way I can change it from embed.

 

Has anyone else had this problem or know a solution? As Z-index seems to be getting ignored :S

 

[Frank P]

Flash files are notorious for the z-index problems they create. The remedy, if all else fails, is to put them in an iframe, which is what YouTube now advises as a matter of standard. Is that possible in your case?

[NewcastleFan]

Hi thanks for your reply. It may be possible to add an Iframe around the actual flash movie itself, do you happen to have a link to any examples or could show me an example of what you mean with the iframe?

 

Thanks

[Frank P]

Here you go: http://www.w3schools.com/html/html_iframe.asp.

[NewcastleFan]

Hey Guys,

 

I've trying playing around with iframe, however it will not work, if I link from an external file all it displays is: {AudioPlayerBlack} which is the tumblr code to load the flash file. Is there any work around with css to keep this at the bottom of divs?