...

View Full Version : Drop Down menu problem



l Squid l
07-16-2007, 03:24 PM
Ok well, these nice, transparent looking drop down menus look sweet, but I try to add drop down menus to the other nav buttons, in my case whenever I move my cursor over videos the teams drop down menu options are shown, the teams drop down menu still works perfectly, but the videos one isnt working. I am not sure if its a CSS, HTML, or Javascript problem.

XHTML Code

<!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>


<meta name="keywords" content="halo 2,halo 3, xbox live, montages, videos, graphics, clan, teams, halo 2 help, " />
<meta name="description" content="This Halo 2 website, has teams, clans, host montages,and graphics. Join our forum." />

<link rel="stylesheet" type="text/css" href="firefox-stylesheet.css" />
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="IE-stylesheet.css" />
<![endif]-->

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Elemental Studios | Montages, Graphics, Teams and more!</title>
<link rel="shortcut icon" type="image/ico" href="Element2.ico" />

<script type="text/javascript">

// Copyright 2006-2007 javascript-array.com

var TimeOut = 300;
var currentLayer = null;
var currentitem = null;

var currentLayerNum = 0;
var noClose = 0;
var closeTimer = null;

// Open Hidden Layer
function mopen(n)
{
var l = document.getElementById("menu"+n);
var mm = document.getElementById("mmenu"+n);

if(l)
{
mcancelclosetime();
l.style.visibility='visible';

if(currentLayer && (currentLayerNum != n))
currentLayer.style.visibility='hidden';

currentLayer = l;
currentitem = mm;
currentLayerNum = n;
}
else if(currentLayer)
{
currentLayer.style.visibility='hidden';
currentLayerNum = 0;
currentitem = null;
currentLayer = null;
}
}

// Turn On Close Timer
function mclosetime()
{
closeTimer = window.setTimeout(mclose, TimeOut);
}

// Cancel Close Timer
function mcancelclosetime()
{
if(closeTimer)
{
window.clearTimeout(closeTimer);
closeTimer = null;
}
}

// Close Showed Layer
function mclose()
{
if(currentLayer && noClose!=1)
{
currentLayer.style.visibility='hidden';
currentLayerNum = 0;
currentLayer = null;
currentitem = null;
}
else
{
noClose = 0;
}

currentLayer = null;
currentitem = null;
}

// Close Layer Then Click-out
document.onclick = mclose;
</script>


<style type="text/css">
<!--
body {
background-repeat: no-repeat;
}
.style1 {font-size: 10px}
-->
</style>



</head>

<body>

<div id="content">

<div class="gapless" align="center">
</div>

<div class="left"></div>

<div class="right">
</div>

<div class="leftpipe">
</div>

<a class="home" href="index.html">Home Link</a>

<ul id="teamsdd">
<li>
<a href="html/teams.html" class="menu" id="mmenu1"
onmouseover="mopen(1);"
onmouseout="mclosetime();"></a>
<div class="submenu" id="menu1"
onmouseover="mcancelclosetime()"
onmouseout="mclosetime();">
<a href="#">Team Element Vl:Pro</a>
<a href="#">Team Element Vl:Semi-Pro</a>
<a href="#">Team Element Vl:Amateur</a>
</div>
</li>
</ul>

<ul id="videodd">
<li>
<a href="html/videos.html" class="menu" id="mmenu1"
onmouseover="mopen(1);"
onmouseout="mclosetime();"></a>
<div class="submenu" id="menu1"
onmouseover="mcancelclosetime()"
onmouseout="mclosetime();">
<a href="#">Halo 2 Montages</a>
<a href="#">Halo 3 Montages</a>
<a href="#">Other</a>
</div>
</li>
</ul>

<a class="graphic" href="html/graphics.html">Graphics Link</a>

<a class="forum" href="http://z7.invisionfree.com/Elemental_Studios/index.php?">Forum Link</a>

<a class="contact" href="html/contactus.html">Contact Link</a>


<div class="rightpipe">
</div>

<div class="indexheader">


<h1><img src="images/Welcome.png" alt="Welcome" width="125" height="38" /></h1>
<p align="center" class="style1"> Hello, and Welcome to Elemental Studios. This section of Elemental Studios is for Halo 2. We are here to help you with you multimedia needs, anything from video editing, to Photoshop, and to your Halo 2 skills! We have a clan, and teams being set-up. So check out our forum, or maybe you would like to see graphics gallery, or check out the videos! Enjoy you stay, here!</p>
<img src="images/LastestNews.png" alt="Lastest News" width="195" height="38" /></div>
<div class="lastestnews">

<p align="center" class="textcontent">&nbsp;</p>
<blockquote>

<p align="left" class="textcontent">Hi guys! Well, its been pretty dead around here. Ads have been disabled. Team Element Vl has spilt up both we have 3 more people interested. Forums are up, and they are look pretty sweet thanks to the guys over at SkinPanel. Drop menus will be added, and site affliations will be coming to get our name around. </p>
<p align="left" class="textcontent"><em>-posted by Squid on July 15th 2007</em></p>

<p align="left" class="textcontent"> Hi guys, todays 7/07/07! Bungie Day! I recommend everyone to go online on Halo 2 at 7:07 pm Pacific time. I heard something big is happening. In other good news we now have a full team, so Team Element: Pro Division is closed for new recruits, please remember that the clan is is looking for memebers also, I will annoce tourneys and such. Now for a couple of side notes, if you are on a team please do not constantly change your Emblem, because I make Team Sigs for the teams which contain the Emblems, If you change your Emblem please think about what you really want, Team Element does not require a certain Emblem or any of that ****. Team Members should have atleast a AIM screen name. Halo3Forum accounts are optional but it would be nice if you did get one, because over there is a wealth of information on Halo 2 and strategies. Also if ou are using IE 7 you may have slight problems viewing the site because ads are now up and I haven't coded to support IE 7 fully yet. If you have Firefox and you are using Adblock please disable for this site.</p>
<p align="left" class="textcontent"><em>-posted by Squid on July 7th 2007</em></p>

<p align="left" class="textcontent">Happy July 4th! I hope you guys had a nice holiday! </p>
<p align="left" class="textcontent"><em>-posted by Squid on July 4th 2007</em></p>


<p align="left" class="textcontent"> Hey, wassup. Within these last two days, you probably have seen many improvements, within the site. The videos page and forums have been added. We are currently having problems, with the video streaming but bear with us, I am talking with support. In other news, soon I will be add more menus to the navigation. If you want to be added to a team just message me on Xbox Live and I will try you out, you will placed in the division where I think fit.</p>
<p align="left" class="textcontent"><em>-posted by Squid on July 3th 2007</em></p>

<p align="left" class="textcontent"> Hi guys, we have three new pages up. The Teams page, Contact Us Page, and the Graphics Page. The forums, and some more graphical upgrades will be coming to the Site. If for any reasons, you are having problems im on AIM at I Squid I, or email me at samyrk@hotmail.com, I check my email daily.</p>
<p align="left" class="textcontent"><em>-posted by Squid on July 2th 2007</em></p>



<p align="left" class="textcontent">Hi all, this is Squid. Today is Grand Opening of Elemental Studios. It was launched before but itwas severely miscoded, in both Firefox and IE. But thanks to a friend of mine named Jutlander I have sucessfully coded it! Please use either Firefox 2 or IE. If you are using an older version of IE please upgrade to IE 7 to view transparent images.</p>
<p align="left" class="textcontent"><em>-posted by Squid on June 30th 2007</em></p>
<p align="left" class="textcontent"><br />
</p>
<p align="left" class="textcontent">&nbsp;</p>
</blockquote>


</div>

<div class="footer">
</div>
</div>




</body>
</html>


Firefox CSS Code

@charset "utf-8";
/* Elemental Studios */

body {
text-align:center;
background:#000000;
margin:auto;
padding:0;
color:#FFFFFF;
font-family:Tahoma, Verdana, sans-serif, Arial;
font-size:11px;
text-decoration:none;
}

#content {
width:770px;
margin:auto;
}
/* Header */

.gapless {
background:url(images/Banner.png);
width:770px;
height:178px;
margin: 0 auto;
}

.left {
background:url(images/Left-Neon-Light.png);
width:121px;
height:592px;
background-repeat:no-repeat;
margin-left:0px;
float:left;
}

.right {
background:url(images/Right-Neon-Light.png);
width:117px;
height:592px;
margin-right:0px;
float:right;
}

/* Nav Start */

.leftpipe {
background:url(images/Left-Pipe.png);
width:50px;
height:36px;
margin: 0 auto;
float:left;
}

.home {
background:url(images/Home.png);
width:70px;
height:36px;
margin: 0 auto;
float:left;
text-indent:-9999em; /*hide text for normal browsers*/
}

.team {
background:url(images/Teams.png);
width:56px;
height:36px;
margin: 0 auto;
float:left;
text-indent:-9999em; /*hide text for normal browsers*/
}

/* Begin Drop Down Menu */
#teamsdd
{ margin: 0;
padding: 0}

#teamsdd li
{ margin: 0;
padding: 0;
list-style: none;
float: left;
font: bold 11px arial}

#teamsdd li a.menu
{ display:block;
text-align: center;
background:url(images/Teams.png);
margin:auto;
color: #FFF;
width: 56px;
height: 36px;
text-decoration: none}

#teamsdd li a.menu:hover
{ background:url(images/Teams.png);
}

.submenu
{ background: #1e1b1b;
border: 1px solid #920101;
visibility:hidden;
position: absolute;
z-index: 3;
filter:alpha(opacity=75);
-moz-opacity:.75;
opacity:.75;
}

.submenu a
{ display: block;
font: 11px arial;
text-align: left;
text-decoration: none;
padding:3px;
color: #ffffff}

.submenu a:hover
{ background: #1e1b1b;
color: #FFF}

/* End Drop Down Menu */

.video {
background:url(images/Videos.png);
width:56px;
height:36px;
margin: 0 auto;
float:left;
text-indent:-9999em; /*hide text for normal browsers*/
background-repeat:no-repeat;
}

/* Begin Video Drop Down Menu */
#videodd
{ margin: 0;
padding: 0}

#videodd li
{ margin: 0;
padding: 0;
list-style: none;
float: left;
font: bold 11px arial}

#videodd li a.menu
{ display:block;
text-align: center;
background:url(images/Videos.png);
margin:auto;
color: #FFF;
width: 56px;
height: 36px;
text-decoration: none}

#videodd li a.menu:hover
{ background:url(images/Videos.png);
}

.submenu
{ background: #1e1b1b;
border: 1px solid #920101;
visibility:hidden;
position: absolute;
z-index: 3;
filter:alpha(opacity=75);
-moz-opacity:.75;
opacity:.75;
}

.submenu a
{ display: block;
font: 11px arial;
text-align: left;
text-decoration: none;
padding:3px;
color: #ffffff}

.submenu a:hover
{ background: #1e1b1b;
color: #FFF}

/* End Video Drop Down Menu */

.graphic {
background:url(images/Graphics.png);
width:76px;
height:36px;
margin: 0 auto;
float:left;
text-indent:-9999em; /*hide text for normal browsers*/
}

/* Begin Graphics Drop Down Menu */
#graphicdd
{ margin: 0;
padding: 0}

#graphicdd li
{ margin: 0;
padding: 0;
list-style: none;
float: left;
font: bold 11px arial}

#graphicdd li a.menu
{ display:block;
text-align: center;
background:url(images/Graphics.png);
margin:auto;
color: #FFF;
width: 76px;
height: 36px;
text-decoration: none}

#graphicdd li a.menu:hover
{ background:url(images/Graphics.png);
}

.submenu
{ background: #1e1b1b;
border: 1px solid #920101;
visibility:hidden;
position: absolute;
z-index: 3;
filter:alpha(opacity=75);
-moz-opacity:.75;
opacity:.75;
}

.submenu a
{ display: block;
font: 11px arial;
text-align: left;
text-decoration: none;
padding:3px;
color: #ffffff}

.submenu a:hover
{ background: #1e1b1b;
color: #FFF}

/* End Graphics Drop Down Menu */

.forum {
background:url(images/Forum.png);
width:57px;
height:36px;
margin: 0 auto;
float:left;
text-indent:-9999em; /*hide text for normal browsers*/
}

.contact {
background:url(images/Contact-Us.png);
width:113px;
height:36px;
margin: 0 auto;
float:left;
text-indent:-9999em; /*hide text for normal browsers*/
}

/* Begin Contact Drop Down Menu */
#contactdd
{ margin: 0;
padding: 0}

#contactdd li
{ margin: 0;
padding: 0;
list-style: none;
float: left;
font: bold 11px arial}

#contactdd li a.menu
{ display:block;
text-align: center;
background:url(images/Contact-Us.png);
margin:auto;
color: #FFF;
width: 113px;
height: 36px;
text-decoration: none}

#contactdd li a.menu:hover
{ background:url(images/Contact-Us.png);
}

.submenu
{ background: #1e1b1b;
border: 1px solid #920101;
visibility:hidden;
position: absolute;
z-index: 3;
filter:alpha(opacity=75);
-moz-opacity:.75;
opacity:.75;
}

.submenu a
{ display: block;
font: 11px arial;
text-align: left;
text-decoration: none;
padding:3px;
color: #ffffff}

.submenu a:hover
{ background: #1e1b1b;
color: #FFF}

/* End Contact Drop Down Menu */

.rightpipe {
background:url(images/Right-Pipe.png);
width:54px;
height:36px;
margin: 0 auto;
float:right;
}

/* Nav End */

/* Content Start */

.headercontent {
background:url(images/Header-Content.png);
float: left;
width: 532px;
height:76px;
}

.textcontent {
font-family:Tahoma, Verdana, sans-serif, Arial;
font-size:11px;
text-indent:50px;
color:#FFFFFF;
text-decoration:none;
}


#contentbox {
overflow: auto;
background : url(images/Content-Box.png) #666767 no-repeat;
width: 532px;
height: 385px;
background-position:center;
float:left;
}

.footer {
background:url(images/Footer.png);
height:95px;
width:532px;
float:left;
}

.indexheader {
background:url(images/Content-Box_UP.png);
width:532px;
height:170px;
float:left;
}

.lastestnews {
background:url(images/Lastest-News.png);
overflow:auto;
width:532px;
height:291px;
float:left;
}



body {
background-repeat : no-repeat;
}

/* Content End */


As Usually any help is appreciated:thumbsup:

l Squid l
07-16-2007, 05:11 PM
Anyone?

l Squid l
07-16-2007, 06:49 PM
NVM fixed it!!!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum