/**
#navsite ul li a#current {
background: white;
border-bottom: 1px solid white;
}
Problem
You want image-based rollovers to replace text links.
Solution
First, wrap the text inside the anchor element in a span:
Homepage
Next, instead of JavaScript, use the background-image property within the
pseudo-class selectors :hover and :active to swap the images
**/
/** rollover
a span {
display: none;
}
a:link {
display: block;
width: 125px;
height: 30px;
background-image: url(btn.gif);
background-repeat: no-repeat;
background-position: top left;
}
a:link:hover {
display: block;
width: 125px;
height: 30px;
background-image: url(btn_roll.gif);
background-repeat: no-repeat;
background-position: top left;
}
a:link:active {
display: block;
width: 125px;
height: 30px;
background-image: url(btn_on.gif);
background-repeat: no-repeat;
background-position: top left;
}
**/