Page is a not externally linkable
- Code, Content, and Presentation
-- CSS
---- Pure CSS Rollover


DrOliver - 11:43 am on Aug 7, 2002 (gmt 0)


I just came up with this idea:

CSS:
a{width:100px;display:block;text-decoration:none;}
a:link{background:#000 url(off.gif);color:transparent;}
a:hover{background:#000 url(on.gif);color:transparent;}

html:
<p><a href="#" title="click here to find out how to reach us">&nbsp;</a></p>

Assume the link image is 100 px wide. It works on IE and Mozilla. It has a title attribut. Even users of text only browser should be able to find out what that link does, although it's a &nbsp;.

One could even have a a:visited with a different background-image to make clear that link has already been followed. Same goes for a:active.

I don't like my own idea too much, but... what do you think?


Thread source:: http://www.webmasterworld.com/css/269.htm
Brought to you by WebmasterWorld: http://www.webmasterworld.com