Need Help Fast! [Archive] - Dynamic Drive Forums

danieljoudrey

12-11-2008, 02:50 AM

Here the problem, I've embeded a youtube playlist on my site.. but when i scoll down.. the video play overlaps my banner which is a image floating in a fix posistion... This is the direct link for anyone noe willing to help
http://www.photoshopmagic.ca/dvideos.html
i created a sdtyle sheet with a z index of 0 and attached it to the player but it still over laps. I've also tried numbers like -10 as well... is there anyways to fix this?

Please get back to me as soon as you can as it's due for a project tomorrow haha
thanks

rangana

12-11-2008, 02:55 AM

See if adding highlighted helps:

<param name="movie" value="http://www.youtube.com/p/02036BAED3FD9EBF" />
<PARAM NAME=wmode VALUE=transparent>
<embed src="http://www.youtube.com/p/02036BAED3FD9EBF" width="480" height="385" align="baseline" type="application/x-shockwave-flash" wmode="transparent"></embed></object>

danieljoudrey

12-11-2008, 04:01 AM

Thank for the help, but it didn't work, it still over laps the banner :(

rangana

12-11-2008, 04:07 AM

Please update your page.

danieljoudrey

12-11-2008, 04:10 AM

there, should be updated

Medyman

12-11-2008, 04:10 AM

rangana's advice would work if your z-indexing was set up properly. Adding z-index to the Flash won't do anything, if the fixed elment doesn't have a z-index applied.

So, add a z-index value higher than 0 (if that's what you have the z-index of the YouTube video's parent element set to) to the header. You'll need to do the same to your menu.

By the way, you're making your life a lot harder with those tables. Your code would run faster and be easier to decipher without them.

danieljoudrey

12-11-2008, 04:14 AM

Yea man, trust me i know that about the tables.. our teachers outadted and makes us do them. Otherwise i wouldn't waste my time with them... i failed the last test because i wouldn't use them. So i'm just going to go by her rules this time. I'll give that a try though and update it again give me a second. And thanks

danieljoudrey

12-11-2008, 04:21 AM

There guys, it should be updated again. i put the z index of the banner up... tried it as high as 100 and it still wouldn't over lap the player.... i also rote the code right in the css for that page as well and it's still not working. I'm not sure if that makes a difference or not though

rangana

12-11-2008, 04:23 AM

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="menuh.js">
</script>
<link rel="stylesheet" href="menu.css" type="text/css" media="screen" />

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PhotoShop Magic - Daniel Joudreys Videos</title>

<style type="text/css">

</style>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>

<body>
<div style="position:fixed;left:0%; top:0%" >
<div align="center"><img src="Images/header.jpg" alt="" width="1382" height="120" align="middle" /></div>
</div>

<center>
<div>
<script type="text/javascript" src="menub.js"></script><noscript>
</noscript>
<table width="898" height="119" border="0" align="center" cellpadding="7">

<tr>
<td width="600" height="115"> </td>
</tr>

</table>
<br />
<div align="center"></div>
<table width="901" height="1351" border="0" align="center" background="Images/background rays.jpg">
<tr>

<td height="1336" align="center" valign="top"><table width="510" height="96" border="0">
<tr>
<td><div align="center" class="style7"></div></td>
</tr>
</table>

<table width="671" height="1063" border="0" cellpadding="20" cellspacing="0">

<tr align="center">
<td width="677" height="59" align="center" valign="baseline" nowrap="nowrap"><h1 align="center">Videos From Daniel Joudrey<em><strong></strong></em></h1> </td>
</tr>
<tr align="center">
<td height="1004" align="left" valign="top" width="901"><p class="style8"> </p>
<p align="center"> <object width="480" height="385" align="baseline">
<param name="movie" value="http://www.youtube.com/p/02036BAED3FD9EBF" />
<PARAM NAME="wmode" VALUE="transparent">
<embed src="http://www.youtube.com/p/02036BAED3FD9EBF" width="480" height="385" align="baseline" type="application/x-shockwave-flash" wmode="transparent"></embed></object></p> </td>

</tr>
</table></td>
</tr>
</table>
</div></center>
<div style="position:fixed;left:0%; top:0%">
<img src="Images/side pieces.png" alt="" width="191" height="1132" align="top" /></div>
<div style="position:fixed;right:0%; top:0%">
<img style="float:right" src="Images/side pieces2.png" alt="" width="173" height="1132" align="top" /></div>
</body>

</html>

Medyman

12-11-2008, 04:23 AM

I don't see the z-index applied. Add the highlighted.

<div style="position:fixed;left:0%; top:0%; z-index:10" >
<div align="center"><img src="Images/header.jpg" alt="Photoshop Magic" width="1382" height="120" align="middle" class="overlap" /></div>
</div>

danieljoudrey

12-11-2008, 04:27 AM

ohh, ok. i had it in the wrong spot.. it's there now, and it did chance the index for the z, i had to change the side images z index as well to make up for it.. but even at a z index of 100 it's still not working? should be up

Medyman

12-11-2008, 04:33 AM

1. Try what rangana posted. He might have some sort of solution for you.
2. If that doesn't work, read this (http://joshuaink2006.johnoxton.co.uk/blog/82/flash-content-and-z-index) article about z-indexing and Flash. You don't have a z-index applied to the YouTube video as you should

danieljoudrey

12-11-2008, 04:35 AM

AH!! there thanks rangana! can i ask you what you've changed, i've looked through it but haven't found what you did to the code?

rangana

12-11-2008, 04:55 AM

I added wmode="transparent" on the embed tag.

...no need for the z-index property there.