Current Menu Link

mark87

12-09-2005, 09:46 PM

I'm using the menu here - http://tutorials.alsacreations.com/rollover_unique/

I wish to mark the current page link on the menu, by providing it with the same look as if it were being hovered over. It doesn't seem to be working though, I'm sure it's just an ordering of id's or something...

HTML-
<ul>
<li><a id="menu1" title="Home" accesskey="1" href="index.html">Home</a></li>
<li id="cu"><a id="menu2" title="Location" accesskey="2" href="location.html">Location</a></li>
<li><a id="menu3" title="Facilities" accesskey="3" href="facilities.html">Facilities</a></li>
<li><a id="menu4" title="Local Attractions" accesskey="4" href="attractions.html">Local Attractions</a></li>
<li><a id="menu5" title="Gallery" accesskey="5" href="gallery/">Gallery</a></li>
<li><a id="menu6" title="Terms & Rates" accesskey="6" href="rates.html">Terms & Rates</a></li>
<li><a id="menu7" title="Contact" accesskey="7" href="contact.html">Contact</a></li>
</ul>

CSS -
/* Hover Link Styles */
#sidebar a#menu1:hover {background-position: 0% -326px;}
#sidebar a#menu2:hover {background-position: 0% -356px;}
#sidebar a#menu3:hover {background-position: 0% -386px;}
#sidebar a#menu4:hover {background-position: 0% -416px;}
#sidebar a#menu5:hover {background-position: 0% -446px;}
#sidebar a#menu6:hover {background-position: 0% -476px;}
#sidebar a#menu7:hover {background-position: 0% -506px;}

/* Current Link Styles */
#cu a#menu2 {background-position: 0% -356px;}

As you see, I'm trying to use 'cu' to mark the current link.

pixelEngine

12-09-2005, 10:16 PM

How about trying to access it like so:

li#cu a {
color: green;
}

maybe

mark87

12-09-2005, 10:21 PM

Erm, no offence but I can see that wouldn't work at all for what I want to do...

_Aerospace_Eng_

12-09-2005, 10:37 PM

Mark can you post a link to the page that you are working on?

mark87

12-09-2005, 10:59 PM

OK, just temporarily here - Link Not Needed Anymore

_Aerospace_Eng_

12-09-2005, 11:06 PM

This should work
/* Current Link Styles */
#cu a#menu1 {background: transparent url(palm.jpg) 0% -326px no-repeat;color:#FFF}
#cu a#menu2 {background: transparent url(palm.jpg) 0% -356px no-repeat;color:#FFF}
#cu a#menu3 {background: transparent url(palm.jpg) 0% -386px no-repeat;color:#FFF}
#cu a#menu4 {background: transparent url(palm.jpg) 0% -416px no-repeat;color:#FFF}
#cu a#menu5 {background: transparent url(palm.jpg) 0% -446px no-repeat;color:#FFF}
#cu a#menu6 {background: transparent url(palm.jpg) 0% -476px no-repeat;color:#FFF}
#cu a#menu7 {background: transparent url(palm.jpg) 0% -506px no-repeat;color:#FFF}

mark87

12-09-2005, 11:14 PM

Thanks. :thumbsup: