CSS Menu Rollover — OZONE Asylum, home of the Mad Scientists

XML - XSL - XSLT - XHTML - CSS - DOM

CSS Menu Rollover

This page's ID: 21838

Edit Post

Who can edit a post?	The poster and administrators may edit a post. The poster can only edit it for a short while after the initial post.

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	http://www.codetown.org/test/ I threw this site together to test image only rollovers on a un-ordered list. I am not sure this is the way that image only rollovers should be done, so I am looking for a critique on the method here. I tested this in both IE and FireFox and it displayed correctly, but I think that there must be a better way to achomplish this. I started off with the standard menu with some added hooks. [code]<div id="menu"> <ul> <li id="news_menu" class="here"><a href="#">News</a></li> <li id="websites_menu"><a href="#">Websites</a></li> <li id="resume_menu"><a href="#">Resume</a></li> </ul> </div>[/code] Then I added the CSS to this. [code]#menu { position: absolute; top: 260px; left: 390px; list-style: none; margin: 0; padding: 0; border: none; width: 220px; } #menu a{ display: block; color: #cc6; font-size: 0px; text-decoration: none; height: 55px; } #menu #news_menu a {background: url("news_menu.gif") transparent no-repeat top left;} #menu #news_menu a:hover {background: url("news_menu_o.gif") transparent no-repeat top left;} #menu #websites_menu a {background: url("websites_menu.gif") transparent no-repeat top left;} #menu #websites_menu a:hover {background: url("websites_menu_o.gif") transparent no-repeat top left;} #menu #resume_menu a {background: url("resume_menu.gif") transparent no-repeat top left;} #menu #resume_menu a:hover {background: url("resume_menu_o.gif") transparent no-repeat top left;}[/code] So, is this a good way to do this? or is this wrong? <edit>Killing billions of line returns</edit> [url=http://www.codetown.org] [img]http://www.codetown.org/img/sig/robot_002.gif[/img] [/url] [small](Edited by [internallink=191]WarMage[/internallink] on 05-17-2004 22:47)[/small] Loading...
Options:	Enable Slimies Enable Linkwords

« Backwards — Onwards »

Show Forum Drop Down Menu