»
EnglishFrenchVietnamese

Print - CSS Highlighting Navigation Menu - JavaScriptBank.com

Full version: jsB@nk » CSS » Vertical menu » CSS Highlighting Navigation Menu
URL: http://www.javascriptbank.com/css-highlighting-navigation-menu.html

CSS Highlighting Navigation Menu © JavaScriptBank.com'Highlight' your menu links as the mouse moves over them using this CSS powered script! Thanks to CSS, the effect is very customizable, efficient, does not rely on script, and finally, very small in file size. Visible in IE4+, NS6+, Opera 6/Mozilla, and degrades well with the rest. A good illustration of what CSS alone can accomplish.

Full version: jsB@nk » CSS » Vertical menu » CSS Highlighting Navigation Menu
URL: http://www.javascriptbank.com/css-highlighting-navigation-menu.html



CSS
<style>/*CSS Menu highlight- By Marc Boussard (marc.boussard@syntegra.fr)Modified by DD for NS4 compatibilityVisit http://www.dynamicdrive.com for this script*/A.menulink {display: block;width: 198px;text-align: left;text-decoration: none;font-family:arial;font-size:12px;color: #000000;BORDER: none;border: solid 1px #FFFFFF;}A.menulink:hover {border: solid 1px #6100C1;background-color:#F0E1FF;}</style>


JavaScript
<script>var ns4class=''</script>


HTML
<table border="0" width=198>  <tr>    <td width="100%" bgcolor="#E6E6E6"><b>Main Menu (CSS)<b></td>  <tr>    <td width="100%"><a href="http://JavaScriptBank.com" class="menulink" class=&{ns4class};>JavaScriptBank.com</a></td>  </tr>  <tr>    <td width="100%"><a href="http://TrucTuyen.org" class="menulink" class=&{ns4class};>TrucTuyen.org</a></td>  </tr>  <tr>    <td width="100%"><a href="http://TrucTuyen.org" class="menulink" class=&{ns4class};>Link #</a></td>  </tr>  <tr>    <td width="100%"><a href="http://TrucTuyen.org" class="menulink" class=&{ns4class};>Link #</a></td>  </tr></table>