JavaScript Forum

**slayerx** · 04-23-2005, 08:39 PM

Having some real problems im still wet behind the ears so to speak whats the best way to spot mistakes is there a way i can get dreamweaver to look at the javascript and spot the errors ive looked myself but i cant see any but then again im tired.

Ive used a book for the code and followed it exactly only making changes for what i want it to show and using my styles etc.

I could put the code here but theres alot too put here, trust me its taken me about half an hour to type it all out : / anyway any help would be greatly appreciated.

**slayerx** · 04-25-2005, 03:00 PM

Anyone?

**chrishirst** · 04-25-2005, 03:06 PM

Try the MS Script Debugger

**slayerx** · 04-25-2005, 03:42 PM

heres the code its long but im hoping someone can spot an error i cant its probably something very basic

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML
 1.0 Transitional//EN" "http://www.w3.org/TR/
 xhtml1/DTD/xhtml1-transitonal.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>text</title>
<script language="javascript" type="text/javascript">

var objnavmenu = null;
var prevobjnavmenu = null;
var prevobjdropmenu = null;
var numdropmenu = 6;


var bglinkcolor ='#0A75A6';
var bgklinkhover ='#129CDC';
var bglinkactive ='#000000';
var linkcolor ='#000000';
var linkhover ='#000000';
var linkactive ='#ffffff';

var isie = null;
if (navigator.appname.indexof
   ('microsoft internet explorer')
   !=-1) isie=1;

function initdropmenu () {
document.onclick = hidedropmenu;
for (i=1; i<=numdropmenu; i++) {
menuname = 'dropmenu' +i;
navname = 'navmenu' +i;
objdropmenu = document.
getelementbyid(menuname);
objnavmenu = document.
getelementbyid(navname);
objdropmenu.style.
visibility ='hidden';
objnavmenu.onmouseover=
menuhover;
objnavmenu.onmouseout=
menuout;
objnavmenu.onclick=
showdropmenu;
}

objnavmenu =null;
return;
}

function menuhover(e) {
document.onclick = null;
hoverobjnavmenu = document.
getelementbyid(this.id);
if (hoverobjnavmenu !=
objnavmenu) {
hoverobjnavmenu.style.color=
linkhover;
hoverobjnavmenu.style.
backgroundcolor=
bglinkhover;
  }
}
.function menuout (e) {
document.onclick = hidedropmenu;
outobjnavmenu = document.
 getelementbyid(this.id);
if (outobjnavmenu !=
 objnavmenu) {
outobjnavmenu.style.color=
linkcolor;
outobjnavmenu.style.
 backgroundcolor =
 bglinkcolor; 
   }
}

function showdropmenu(e) {
menuname = 'drop' +this.id.
 substring(3,this.id.length);
objdropmenu = document.
 getelementbyid(menuname);
if(preobjdropmenu ==
 objdropmenu) {
hidedropmenu();
return;
}
if (prevobjdropmenu !=null)
 hidedropmenu();
objnavmenu = document.
 getelementbyid(this.id);
if ((preobjnavmenu !=
 objnavmenu ) ||
 (preobjdropmenu == null)) {
objnavmenu.style.color=
 linkactive;
objnavmenu.style.
 backgroundcolor =
 bglinkactive;
}
if (objdropmenu) {
xpos = objnavmenu.
 offsetparent.offsetleft +
 objnavmenu.offsetleft;
ypos = objnavmenu.
 offsetparent.offsettop +
 objnavmenu.offsetparent.
 offsetheight;
if(isIE) {
ypos -=1;
xpos -=6;
}

objdropmenu.style.left=
 xpos + 'px';
objdropmenu.style.top=
 ypos + 'px';
objdropmenu.style.
 visibility = 'visible';
preobjdropmenu =
 objdropmenu;
prevobjdropmenu = objnavmenu;
   }
}

function hidedropmenu() {
document.onclick = null;
if (prevobjdropmenu) {
preobjdropmenu.style.
 visibility = 'hidden';
prevobjdropmenu = null;
prevobjnavmenu.style.color =
 linkcolor;
prevobjnavmenu.style.
 backgroundcolor =
 bglinkcolor;
}
objnavmenu = null;
}
</script>
<style type="text/css" media=
 "screen"><!--

body {
margin: 0px
padding: 0px;
}
#page {
margin: 10px;
}
#menubar {
color: #999999
font-size: 12px;
font-weight: bold;
text-align: left;
display: block;
margin-bottom: 5px;
position: relative;
top: 0px;
left: 0px;
right: 0px;
width: 99%;
overflow: hidden;
vertical-align: middle;
border: solid: 1px #000000;
background-color: #cccccc;
}

.menuheader
color: #000000;
text-decoration: none;
white-space: nowrap;
cursor: pointer;
padding: 5px;
margin: 0px;
pading-right: 15px;
display: inline;
position: relative;
border-right: 1px solid: #000000;
}

a.menulink {
display: block;
padding: 2px 5px;
border-top: 1px solid #cccccc;
}
a.menulink:link {
color: #000000;
text-decoration: none;
}
a.menulink:visited {
color: #000000;
text-decoration: none;
}
a.menulink:hover {
color: #129CDC;
text-decoration: none;
background-color: #000000;
}
a.menulink:active {
color: #ffffff;
text-decoration: none;
background-color: #000000;
}
 
.menudrop {
color: #999999;
font-size: 10px;
font-family: arial;
background-color: #ffffff;
background-repeat: repeat;
visibility: hidden;
margin: 0;
padding: 0;
position: absolute;
z-index: 1000;
top: 60px;
left: 0;
width: 175px;
height: auto;
border-style: solid;
border-width: 0 1px 1px;
border-color: #003365;
}
--></style>
</head>
<body bgcolor ="#ffffff"
onload=initdropmenu()">
<div id="menubar">
<div id="navmenu1" class"menuheader">News</div>
<div id="navmenu2" class"menuheader">Playstation</div>
<div id="navmenu3" class"menuheader">PSP</div>
<div id="navmenu4" class"menuheader">Xbox</div>
<div id="navmenu5" class"menuheader">Nintendo</div>
<div id="navmenu6" class"menuheader">Forums</div>
</div>

<div id="dropmenu1" class="menudrop">
<a class="menulink" href="#" onfocus="if(this.blur)this.blur();>Today</a>
<a class="menulink" href="#" onfocus="if(this.blur)this.blur();>Yesterday</a>
<a class="menulink" href="#" onfocus="if(this.blur)this.blur();>last Week</a>
<a class="menulink" href="#" onfocus="if(this.blur)this.blur();>Last Month</a>
</div>
<div id="dropmenu2" class="menudrop">
<a class="menulink" href="#" onfocus="if(this.blur)this.blur();>Previews</a>
<a class="menulink" href="#" onfocus="if(this.blur)this.blur();>Reviews</a>
<a class="menulink" href="#" onfocus="if(this.blur)this.blur();>Walkthroughs</a>
</div>



</body>
</html>