[CSS] Horizontal CSS Image Menu v1.0

1) CODE TITLE: Horizontal CSS Image Menu v1.0

2) AUTHOR NAME/NOTES: BLiZZaRD

3) DESCRIPTION: A pure CSS driven menu that enables dual image replacement for using custom images instead of text in your menus. Cross browser compatible and will degrade to a UL for text only. Can be altered to accommodate large or small pictures and can change images on the fly with a slight alter of CSS code.

4) URL TO CODE: Horizontal CSS Image Menu Includes instructions and explanations with each step of code :)

Note this is version 1. There are updates I am working on for a final release version, such updates include; removing the flicker form the image loading/caching, removing the dotted line from the visited links, and adding a working image/text replacement option.

I have edited and fixed the blink/flicker of the images by adding a simple preloader.

I also have 2 versions of the script, Version one as above, without the use of text in the buttons and Version 2 which uses the defined text on the buttons.

Still working on a clean neat way to include the text in version 1 so it will degrade even better with older browsers, or when images are turned off. Version 2 of course handles this already.

And finally, after some thinking and action, the straight image version (#1) is complete as well. If a visitor hass CSS, and thus the images here) turned off, text links and a standard UL will appear in it's place!

Very nice!

Quote:

---

Originally Posted by BLiZZaRD

And finally, after some thinking and action, the straight image version (#1) is complete as well. If a visitor hass CSS, and thus the images here) turned off, text links and a standard UL will appear in it's place!

Very nice!

---

The example link is not working. Could somebody please update the link and how it works please or at least a working example and code.

-Thanks