Div Embed - z-index help. Options

[sebbywood]

Okay, so I'm trying to get the myspace flash gallery on top of an image... and I cant get it to work. I think I might be doing something really obviously stupid, but can't work it out - so I'm fed up with this code atm.

Anyway...

ABOUT ME:

CODE

<style>td td object {position:absolute; left:38%; top:758px; display:block; width:0px; height:0px;}</style>

<style>
.orangetext15, .navbar, .contacttable {display:none;visibility:hidden;}

div table {background-color:transparent;}
td.text table {visibility:hidden;}
td.text table table, td.text table table td.text {visibility:visible;}
td td td td td div {background-color:transparent;}
td td td td td div strong {visibility:hidden;}
table table table {visibility:hidden;}

body {
background-color:ffffff;
background-image:url('http://farm1.static.flickr.com/210/500360228_52b32c78b6_o.jpg');
}

table, tr, td {background:transparent; border:0px;}
table table table {background-color:transparent;}


input {background-color:transparent !important;}

td, span, div, input, textarea, a, table td div div font,
div table tr td font {font-family:arial !important;}

td, span, div, input, textarea, table td div div font,div table tr td font {
color:000000 !important;
font-size:8pt !important;
font-family: Verdana, Arial, Helvetica, sans-serif !important;
}
.nametext, .whitetext12, .lightbluetext8, .orangetext15, .blacktext12, .blacktext12 span,.redtext, .redbtext, .blacktext10, .btext {color:000000 !important; font-size:8pt !important;}

a {color:ffffff !important;text-decoration:none !important; text-transform:none !important; font-weight:normal !important; font-style:normal !important;}

a:hover {color:ff00ff !important; text-decoration:none !important; font-style: normal !important; font-weight: normal !important; text-transform: normal !important; }

img {border:0px;}

.blacktext10 {display:block;}

.vuemusic { position:absolute;
left:50%; top:135px;
width:800px;
height:1250px;
z-index:1;
margin-left:-400px;
padding:0px;
border:0px;
background-color:transparent;}


div.gallery { position:absolute;
left:41px; top:552px;
width:725px; height:300px;
z-index:2;
background-color:transparent;
}

</style>

WHO ID LIKE TO MEET:

CODE

<div class="vuemusic">

<div class="gallery">
<object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="all" height="300" width="725" align="middle" data="http://lads.myspace.com/photoshow/slideshow.swf">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="all" />
<param name="movie" value="http://lads.myspace.com/photoshow/slideshow.swf" />
<param name="quality" value="high" />
<param name="scale" value="noscale" />
<param name="wmode" value="transparent" />
<param name="flashvars" value="userID=393980091&bgColor=16777215&bgColor2=16777215&transitionSpeed=4&transitionStyle=a&showCaptions=0&albumID=734472" />
</object>
</div>


<img src="http://www.sebbywoodproductions.co.uk/vue/newvue.jpg" width="800" height="1250" border="0" usemap="#Map" />
<map name="Map" id="Map"><area shape="rect" coords="253,1030,551,1205" href="http://www.msplinks.com/MDFodHRwOi8vd3d3Lm15dnVlLmNvbQ==" />
<area shape="rect" coords="241,1219,569,1235" href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnNlYndoaXRlLmNvLnVr" />
<area shape="rect" coords="557,194,755,343" href="http://www.msplinks.com/MDFodHRwOi8vd3d3Lml0dW5lc2Zlc3RpdmFsLmNvbQ==" />
<area shape="rect" coords="558,368,756,515" href="http://www.msplinks.com/MDFodHRwOi8vd3d3Lm1jZmx5LmNvbQ==" />
<area shape="rect" coords="341,350,401,380" href="http://www.msplinks.com/MDFodHRwOi8vd3d3Lm15dnVlLmNvbS9pdHVuZXMv" />
<area shape="rect" coords="408,353,528,380" href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnRpY2tldG1hc3Rlci5jby51ay9hcnRpc3QvOTY4MTU3" />
</map>

</div>

Can anyone help?

[schizo]

I could be wrong, but I'm pretty sure the higher the z-index, the more towards the top the div is. You have it set to 1 now. Try setting it to 9.

[sebbywood]

I've tried this, but it still doesn't work. Eeeek.

[sebbywood]

Okay, so I've tried some other flash inside this and the main div and it isnt working. So I'm lead to believe that the flash isnt showing, and there is no reason that i can see for it to not be showing...

Help?


Below is the code for the slideshow. above (first post) is the code for the profile.

CODE

<embed src="http://lads.myspace.com/photoshow/slideshow.swf" type="application/x-shockwave-flash" quality="high" scale="noscale" wmode="transparent" flashvars="userID=393980091&bgColor=16777215&bgColor2=16777215&transitionSpeed=9&transitionStyle=a&showCaptions=0" width="701" height="300" name="slider" align="middle"/>

[schizo]

Ah, I see the problem. It's the scrolling thing in the middle that you want to show up, correct? Erase this part at the very beginning of the first part of your code.

CODE

<style>td td object {position:absolute; left:38%; top:758px; display:block; width:0px; height:0px;}</style>

That should help, hopefully.