[thelist] Hover events within a UL

Stephen Rider evolt_org at striderweb.com
Sun Feb 11 18:41:09 CST 2007

On Feb 8, 2007, at 10:25 PM, Craig Givens wrote:

> I'm trying to apply an :hover event to a UL so that when a user mouses
> over the block, the entire block appears to change background colours
> and is also clickable with an applied <a href="link.htm">.

It's actually not too hard.  You _don't_ need JavaScript.  The A tag  
is inside the UL. Use CSS to set the A tag as "display: block;" and  
set the width and height of the A tag.  It will stretch to fill the  
UL, and thus the entire UL is filled with the A tag.  Use the hover  
effects, CSS backgrounds, etc. on the A tag.

I do this in the sidebar navigation on this site:

Note that the clickable area stretches all the way to the left  
border, despite the length of the text....

Hope that helps.  Good luck!

Stephen Rider

More information about the thelist mailing list