Video & Rollover links
Posted: Thu Jul 07, 2011 2:08 pm
Hello,
I have a video on a page with a few rollover links under the video. The popups appear underneath the video. What I would like is for the popups to appear over or ontop of the video.
How can I do that? Is that accomplished with layers or is there another way to get the popup to appear ontop of the video?
Any help would be much appreciated.
Thanks
Below is an example of what the video & links look like
http://www.maxxis.com/Bicycle/Mountain/Ikon.aspx
Here is the code that I am using:
I have a video on a page with a few rollover links under the video. The popups appear underneath the video. What I would like is for the popups to appear over or ontop of the video.
How can I do that? Is that accomplished with layers or is there another way to get the popup to appear ontop of the video?
Any help would be much appreciated.
Thanks
Below is an example of what the video & links look like
http://www.maxxis.com/Bicycle/Mountain/Ikon.aspx
Here is the code that I am using:
Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<style type="text/css">
#video {
position:absolute; width:331px; height:330px; z-index:2; left: 241px; top: 129px; background-color: #FFF600;
}
#tech_stamps {
position:absolute; width:530px; height:55px; z-index:1; left: 241px; top: 475px; background-color: #00CCFF;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<span style=""></span>
<font color="#00FFFF"></font>
<DIV align=center id="video"><IFRAME height=331 src="http://www.youtube.com/embed/Wu1WHVA-p9k?rel=0" frameBorder=0 width=530 allowfullscreen="">
</IFRAME></DIV>
<LINK rel=stylesheet type=text/css href="http://www.maxxis.com/Files/style.css">
<div align="center" id="tech_stamps"><SPAN id=rollover1><A href="#"><IMG border=0 alt="" src="http://www.maxxis.com/Images/exo_stamp.jpg"> <SPAN><IMG style="BORDER-BOTTOM: orange 3px solid; BORDER-LEFT: orange 3px solid; BORDER-TOP: orange 3px solid; BORDER-RIGHT: orange 3px solid" border=0 src="http://www.maxxis.com/Images/EXO_tech_info.jpg"> </SPAN></A></SPAN><SPAN id=rollover2><A href="#"><IMG border=0 alt="" src="http://www.maxxis.com/Images/3C_stamp.jpg"> <SPAN><IMG style="BORDER-BOTTOM: orange 3px solid; BORDER-LEFT: orange 3px solid; BORDER-TOP: orange 3px solid; BORDER-RIGHT: orange 3px solid" border=0 src="http://www.maxxis.com/Images/3C-MTN_tech_info.jpg"> </SPAN></A></SPAN><SPAN id=rollover3><A href="#"><IMG border=0 alt="" src="http://www.maxxis.com/Images/exc_stamp.jpg"> <SPAN><IMG style="BORDER-BOTTOM: orange 3px solid; BORDER-LEFT: orange 3px solid; BORDER-TOP: orange 3px solid; BORDER-RIGHT: orange 3px solid" border=0 src="http://www.maxxis.com/Images/EXC_tech_info.jpg"> </SPAN></A></SPAN></div>
</body>
</html>