Information
Map #1
Find out their names
This is a CSS version of an image map that also works in IE5.5 and IE6 (IE5.01 does not hover well but the links work).
Just hover your mouse over the image to display areas that can be used as links to other pages.
Hover over each highlighted area to get the name of each dwarf (and Snow White). You will note that this will then be the ONLY active area on the image until you move your mouse off the active area. The links by the way do not lead to anywhere but are just to show in the task bar.
Map #2
Find out their names
This is similar to the Snow White image map but using a slightly different method for highlighting each figure. The names are produced using their href 'titles' and the Definition List text.
Why?
There have been a few sites recently that have produced image maps that either use css AND javascript or will not work in IE. So I decided to have a go at producing a cross browser version of my own. This one is JUST CSS and a standard DEFINITION LIST.
Rainbow
Scan the grey areas with your mouse to reveal the colours of the rainbow.
Once more done with just CSS and a DEFINITION LIST. No images were used in the making of this rainbow.
Copyright
You may use this method on your personal 'non-profit' web site without seeking my permission. A link back to CSSplay is always appreciated.
Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSSPlay.
If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced. Please email me for more information.
Recommended Sites
- UK Game Server Hosting
- pay as you go e-commerce
Build your own SEO friendly webshop - Web design in Dorset
Bournmouth based web design agency - web hosting, dedicated servers
web reseller, managed servers - Host Color
Web Hosting for 30 Websites
