Rollovers with Coordinates!

[haven]

well, i was wondering if that was possible. since you can set a hotspot with coords, can you set a rollover? I am really in need of this because my navbar is not sliced up, and i dont want to slice it.

[thebloodpoolkid]

You would use absolute positioning. The way I accomplish this is, in my HTML have something like this


<div id="nav_main">
<ul>
<li id="nav_home"><a href="index.html">Home</a></li>
</ul>

And my css like this


#nav_home {
position:absolute;
left: 50px;
top:10px;
}


nav_home a {
display:block;
width:145px;
height:30px;
line-height: 30px;
background:transparent url(/img/home-up.gif) no-repeat center top;
text-indent: -9999px;
}

#nav_find a:hover {
background: transparent url(/img/home-over.gif) no-repeat center bottom;
}

Not sure if that is what your looking for but this is how I would go about doing it.

[tommythewolfboy]

why not use css and position the anchors that way?

[ah - thebloodpoolkid beat me to it!]

[tommythewolfboy]

Since I assume that you have multiple clickable links within the navbar, you would be best of having a parent div containing the background navbar image, and then each of the clickable elements relatively positioned inside it. The clickable elements are then positioned relative to the parent div, not the page. That way, if you choose to move the parent div, you won't mess up the positioning for the anchors.

[thebloodpoolkid]

Since I assume that you have multiple clickable links within the navbar, you would be best of having a parent div containing the background navbar image, and then each of the clickable elements relatively positioned inside it. The clickable elements are then positioned relative to the parent div, not the page. That way, if you choose to move the parent div, you won't mess up the positioning for the anchors.


oops, I forgot to mention the parent div must be positioned relative.