It's worse than that. There are quite a number of typos (probably introduced by an editor program or content manager). In addition, the script is out of date. Here is an updated and corrected version tested on IE6, Opera9, and FF1.5.0.4:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#divMenu {
font-family:arial,helvetica,sans-serif;
font-size:12pt;
font-weight:bold;
}
#divMenu a {
text-decoration:none;
}
#divMenu a:hover {
color:red;
}
</style>
<script type="text/javascript">
/****************************************
Submitted with modifications by Jack Routledge (http://fastway.to/compute) to DynamicDrive.com
Copyright (C) 1999 Thomas Brattli @ www.dhtmlcentral.com
This script is made by and copyrighted to Thomas Brattli
This may be used freely as long as this msg is intact!
This script has been featured on http://www.dynamicdrive.com
Modified 7/21/06 in http://www.dynamicdrive.com/forums by jscheuer1
to correct typos, update for optional DTD's and current tag conventions
****************************************
Browsercheck:*/
ie=document.all?1:0
n=document.layers?1:0
ns6=document.getElementById&&!document.all?1:0
//These are the variables you have to set:
//How much of the layer do you wan't to be visible when it's in the out state?
lshow=60
//How many pixels should it move every step?
var move=10;
//At what speed (in milliseconds, lower value is more speed)
menuSpeed=40
//Do you want it to move with the page if the user scroll the page?
var moveOnScroll=true
/***************************************
You should't have to change anything below this.
****************************************/
//Defining variables
function truebody(){
return (document.compatMode!="BackCompat")? document.documentElement : document.body
}
var ltop;
var tim=0;
//Object constructor
function makeMenu(obj,nest){
nest=(!nest) ? '':'document.'+nest+'.'
if (n) this.css=eval(nest+'document.'+obj)
else if (ns6) this.css=document.getElementById(obj).style
else if (ie) this.css=eval(obj+'.style')
this.state=1
this.go=0
if (n) this.width=this.css.document.width
else if (ns6) this.width=document.getElementById(obj).offsetWidth
else if (ie) this.width=eval(obj+'.offsetWidth')
this.left=b_getleft
this.obj = obj + "Object"; eval(this.obj + "=this")
}
//Get's the top position.
function b_getleft(){
if (n||ns6){ gleft=parseInt(this.css.left)}
else if (ie){ gleft=eval(this.css.pixelLeft)}
return gleft;
}
/***********************************
Deciding what way to move the menu (this is called onmouseover, onmouseout or onclick)
************************************/
function moveMenu(){
if(!oMenu.state){
clearTimeout(tim)
mIn()
}else{
clearTimeout(tim)
mOut()
}
}
//Menu in
function mIn(){
if(oMenu.left()>-oMenu.width+lshow){
oMenu.go=1
oMenu.css.left=oMenu.left()-move+'px'
tim=setTimeout("mIn()",menuSpeed)
}else{
oMenu.go=0
oMenu.state=1
}
}
//Menu out
function mOut(){
if(oMenu.left()<0){
oMenu.go=1
oMenu.css.left=oMenu.left()+move+'px'
tim=setTimeout("mOut()",menuSpeed)
}else{
oMenu.go=0
oMenu.state=0
}
}
/*********************************
Checking if the page is scrolled, if it is move the menu after
**********************************/
function checkScrolled(){
if(!oMenu.go) oMenu.css.top=eval(scrolled)+parseInt(ltop)+'px'
if(n||ns6) setTimeout('checkScrolled()',30)
}
/*********************************
Inits the page, makes the menu object, moves it to the right place,
show it
**********************************/
function menuInit(){
oMenu=new makeMenu('divMenu')
if (n||ns6) scrolled="window.pageYOffset"
else if (ie) scrolled="truebody().scrollTop"
oMenu.css.left=-oMenu.width+lshow+'px'
if (n||ns6) ltop=oMenu.css.top
else if (ie) ltop=oMenu.css.pixelTop
oMenu.css.visibility='visible'
if(moveOnScroll) ie?window.onscroll=checkScrolled:checkScrolled();
}
//Initing menu on pageload
window.onload=menuInit;
</script>
</head>
<body>
<div id="divMenu" style="position:absolute; top:250px; left:30px; visibility:hidden; background-color:#F0F0F0">
<nobr>
<a href="http://www.dynamicdrive.com">Dynamic Drive</a> -
<a href="http://www.codingforums.com">Coding Forums</a> -
<a href="http://active-x.com/">Active-X.com</a> -
<a href="javascript:void(0);" onclick="moveMenu()" style="background-color:yellow;text-decoration:none">MENU</a>
</nobr>
</div>
</body>
</html>
Notes: There are still some things about this script that I am not thrilled with, most notably the extensive use of the eval() method but, it works in the browsers mentioned and perhaps will in others.
slide in links
Reply With Quote
Bookmarks