λ
January 21st, 2004, 11:52 AM
I've almost got it working.. works in Mozilla 1.6 perfectly, Opera perfectly, but not in IE... sadly, the links are still blue :(. But it's perfectly semantic and everything (no tables)... if I knew more JavaScript I could probably make it work in IE too...
<!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>
<script type="text/javascript">
function s(x){
x.style.backgroundColor = '#ccc';
x.style.color = 'green';
}
function rs(x){
x.style.backgroundColor = '#fff';
x.style.color = 'red';
}
</script>
<style type="text/css">
html {
font-family: Verdana, Geneva, Helvetica, Arial, sans serif;
font-size:10px;
font-weight:bold;
}
#menu {
position:relative;
top:5px;
}
#menu li {
color:red;
}
#menu a {
color:inherit;
text-decoration:none;
}
#menu li {
margin-left:-4px;
display:inline;
padding:10px;
border:1px solid #ccc;
letter-spacing:1px;
}
</style>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<ul id="menu">
<li onmouseover="s(this);" onmouseout="rs(this)"><a href="">Home</a></li>
<li onmouseover="s(this);" onmouseout="rs(this)"><a href="">Services</a></li>
<li onmouseover="s(this);" onmouseout="rs(this)"><a href="">Company</a></li>
<li onmouseover="s(this);" onmouseout="rs(this)"><a href="">Contact</a></li>
<li onmouseover="s(this);" onmouseout="rs(this)"><a href="">FAQs</a></li>
</ul>
</body>
</html>