| Demo | Type | CSS/JS | HTML | Image Files |
|---|---|---|---|---|
| hnav01.htm | CSS3 Gradient Menu Buttons | hnav01.css | hnav01txt | |
| hnav02.htm | Matt Black Tabs | hnav02.css | hnav02txt | |
| hnav03.htm | Animated horizontal tabs | hnav03.css | hnav03txt | tab-blue-right.gif tab-blue-right (1).gif |
| hnav04.htm | JavaScript Drop Line Menu |
hnav04.css droplinebar.css droplinemenu.js | hnav04txt | bluedefault.gif blueactive.gif down.gif |
| vnav01.htm | Glossy Vertical Menu | vnav01.css | vnav01txt | glossyback.gif glossyback2.gif |
| vnav02.htm | Button Vertical Menu | vnav02.css | vnav02txt | |
| vnav03.htm | Sexy Panels Vertical Menu | vnav03.css | vnav03txt | |
| vnav04.htm | Nested Side Bar Menu | vnav04.css | vnav04txt | right.gif |
.gif){kind=link}
*All examples are from Dynamic Drive, see http://www.dynamicdrive.com/style/ for much more.
To use any of the navigation schemes on your page(s) is simple. Basicaly,
there are two steps:
- Copy/Paste the CSS to your page. Place the CSS between <style
type="text/css"> and <style> in the <head> section of
your page. Alternatively, you could just download the .css file, put
it in the same folder as your page, and then, in the <head> section
of your page, link to the .css file, like this
<link rel="stylesheet" type="test/css" href="nav00.css" />
- Copy/Paste the HTML code into your page.
If the navigation you choose uses images, then save the image files to an images subfolder of the folder your page is in.
That's all there is to it - now enjoy professional looking navigation on all of the pages on your website.