A Single Article
Read it, comment, and share it with your friendsRevisiting Image Rollovers
The topic of image rollovers came up again today on the Web Standards Group, and I went off to recommend a solution. The page in question was the usual rollover trash pretending to be accessible but degrading to blank space with images disabled and CSS on. I revisited my own rollover technique and had a look at a solution posted in the comments: Ryan Rollovers. Ryan put a nice demonstration together for his technique and after testing it a little, I’ve decided to fully support Ryan Rollovers in all future projects. Have a look yourself, report any incompatibilities, and see what you think. It’s a little heavier than my own technique but I think it is also more stable. It might even work inside of table cells, which is definitely a limitation of mine.
Nevermind, the demo is gone.
2 Trackbacks/Pingbacks
Other blogs referencing this article3 Comments
Responses to my articleFor the images used to do the rollovers you need to add pixels to left and bottom that is enough whitespace, (in this case in the same color as background) to cover up the font 3x enlarging. This way the enlarged fontsize will be covered up. For the rest it looks good.
Hey thanks for the comments, I’ve sorted out the missing title content and cleaned up the css a little. I hadn’t really put much thought into this but having noticed more people visiting the page I think I may redesign it and make it look a bit nicer.
Cheers,
Ryan.
p.s. I love the live posting/feedback you’ve got here, is this wordpress?
Yep, this is Wordpress. Glad I could help.
Sorry, comments for this entry are closed at this time.