CSS World Map Rollover
The working code:
Author: Free CSS Menus: www.freecssmenus.co.uk
Description: I made the UK rollover map last year and thought that it was about time the internet had a descent CSS rollover world map... well here it is.
Before I start getting emails, I know that this map is geologically inaccurate but it was the best map that I could find to use for this example. It is impossible to use the sliding doors technique with this example. To avoid slow down upon rollover you could use javascript to preload the images in the HEAD section of the code.
Category: Image Rollover
Tested Browsers: AOL 9, Firefox 3.0.1, Opera 9.10, IE 7
Comments:
Is it possible to get a psd-file for the world map?
Ive tried this effect using stylesheets but given up due to compatability... this seems to work cross browser though. Many Thanks
Great CSS world map
Rollover world map that aint javascript or flash - about time !
Wow! Didnt realise that this kind of effect was achievable with CSS. I found this page ranked no 1 with google for rollover world map. It looks and works great! There are some great other css effects on this site, well worth surfing! Try Divine CSS for more great css resources.
More CSS related to this script:
Icon Yellow Rollover Button. Some visitors to your websites may have poor vision or disabilities which prohibits them from clicking on small buttons easily. This problem is easily remedied with very little css code and minimal effort... and it looks better than your boring old hypertext. Don`t forget that even though scripts like this use images, they are still just hypertext!
Red Green and Blue Menu. These three css menus use subtle shades of red, green and blue, just enough to add a touch of class to any website.
When you come to copy the code, only copy the css and xhtml that corresponds to the colour which you have decided to use.
Css rollover uk map. Free rollover map of the United Kingdom. Use this smart css rollover on your own website so that visitors can quickly tell you where about in the UK they are from. This css effect is an illusion which could, potentially take any form of animation you wish. I use the word illusion because the brain immediately believes that something clever is going on.
With a little time and patience you could replicate this simple css rollover map, or you could just copy and paste these images and code.
CSS World Map Rollover. I made the UK rollover map last year and thought that it was about time the internet had a descent CSS rollover world map... well here it is.
Before I start getting emails, I know that this map is geologically inaccurate but it was the best map that I could find to use for this example. It is impossible to use the sliding doors technique with this example. To avoid slow down upon rollover you could use javascript to preload the images in the HEAD section of the code.
Latest CSS:
•
Animated navigation menu
Great animated vertical menu. Our first submission by one of our visitors. Top M ...
Added: Monday 15 Feb, 2010
•
CSS vertical numeric keypad
Stylish CSS vertical numeric keypad. ...
Added: Sunday 03 Jan, 2010
•
Red Green and Blue Menu
These three css menus use subtle shades of red, green and blue, just enough to a ...
Added: Thursday 31 Dec, 2009
•
2010 Dark Gloss Nav
If you have a dark website, this glossy nav menu a perfect compliment for it. ...
Added: Wednesday 30 Dec, 2009
•
Dark Flash Metal Menu
You may be mistaken for thinking that this menu was created using flash. CSS, ba ...
Added: Monday 30 Nov, 2009
Top Rated:
CSS World Map Rollover
I made the UK rollover map las ...
![]()
4.9 / 5 - 29 Ratings
Curved Horizontal Menu
This horizontal menu shows how ...
![]()
4.5 / 5 - 16 Ratings
Diagonal Horizontal Gr ...
This horizontal menu took quit ...
![]()
4.8 / 5 - 5 Ratings
Diagonal Horizontal Bl ...
This horizontal menu took quit ...
![]()
4.6 / 5 - 5 Ratings
Curved white css borde ...
Creating curved corners for yo ...
![]()
4.5 / 5 - 4 Ratings









