Hi and I am trying to embed a modified version of a javascript/css script from http://www.javascriptkit.com/script/script2/dbmenu/# but since have made a few problems. At the moment, my script is only compatible with Internet Explorer 7 (not compatible with earlier versions) and can anybody help me debug the top menu at http://cwarn23.info/cms/ The blog menu should be a drop down menu with only one object in it ("categories" link). But at the moment, the categories link is beside the blog menu. Most of my script is the same as the one at javascript kit but can anybody tell me what makes it so different to make it incompatible with most browsers.
Webpage:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<script src='http://cwarn23.info/cms/dbMenu.js' type='text/javascript'></script>
<style type='text/css' rel='stylesheet' media='screen'>
#menu{
position:relative;
z-index:1;
top:0;
left:0;
padding:2px;
margin:0px;
list-style:none;
}
li ul{
position:relative;
background-color:#ffffff;
border:1px solid black;
display:none;
padding:2px;
margin:0px;
list-style:none;
}
li{
position:relative;
padding:2px;
margin:0px;
color:#000000;
}
.subMenu{
background-repeat:no-repeat;
}
.click{
background-color:#FFCE11;
color:#fffab5;
}
.click ul{
display:block;
}
.hover, ul li a:hover{
cursor:pointer;
background-color: #FFCE11;
color:#FFFAB5;
}
li ul li.hover, li ul li.hover a:hover{
background-color:#FFCE11;
}
li a{
width:100%;
}
li a, li ul li a, li.hover ul li a{
text-decoration:none;
color:#000000;
}
li.hover a, li ul li.hover a{
color:#fffab5;
text-decoration:underline;
}
</style><link href='http://cwarn23.info/cms/dropDown.css' type='text/css' rel='stylesheet' media='screen'></head><body bgcolor='#FFCE11' topmargin=0 bottommargin=0 leftmargin=0 rightmargin=0><table border=0 cellpadding=5 cellspacing=0 width=100% height=100%><tr><td bgcolor='#FF9C00' align=center valign=top><font face='arial black' size=6> My Website</font><br><table border=0 cellpadding=0 cellspacing=0 height=28><tr>
<td style='background-image: url("http://cwarn23.info/cms/standardpics/button01left.php?alpha=FFCE11");' width=14></td>
<td style='background-image: url("http://cwarn23.info/cms/standardpics/button01middle.php?alpha=FFCE11");'>
<ul id='menu' class='dbMenu onMouse'>
<li><a href='http://cwarn23.info/cms/index.htm'><font color=#0000FF>Homepage</font></a></li>
</ul></td>
<td style='background-image: url("http://cwarn23.info/cms/standardpics/button01middle.php?alpha=FFCE11");' width=25></td>
<td style='background-image: url("http://cwarn23.info/cms/standardpics/button01middle.php?alpha=FFCE11");'>
<ul id='menu' class='dbMenu onMouse'>
<li><a href='http://cwarn23.info/cms/blog/'><font color=#0000FF>Blog</font></a></li><ul><li><a href='http://cwarn23.info/cms/blog/category/'><font color=#0000FF>category</font></a></li></ul></ul></td>
<td style='background-image: url("http://cwarn23.info/cms/standardpics/button01middle.php?alpha=FFCE11");' width=25></td>
<td style='background-image: url("http://cwarn23.info/cms/standardpics/button01middle.php?alpha=FFCE11");'>
<ul id='menu' class='dbMenu onMouse'>
<li><a href='http://cwarn23.info/cms/sitemap.htm'><font color=#0000FF>Sitemap</font></a></li>
</ul></td>
<td style='background-image: url("http://cwarn23.info/cms/standardpics/button01right.php?alpha=FFCE11");' width=14></td>
</tr></table><br></td></tr><tr><td bgcolor='#FFCE11' valign='top'><img src='http://cwarn23.info/cms/standardpics/textimage.php?session=0'><br><img src='http://cwarn23.info/cms/standardpics/textimage.php?session=1'><br>This is a test.</td></tr></table></html>The above is the webpage source and all external resources have not been changed.