|
|
Posted by windandwaves on 10/22/05 06:47
Neredbojias wrote:
> With neither quill nor qualm, windandwaves quothed:
>
>> Hi Folk
>>
>> Just a bit of help here for newbies who want their menus to look
>> nicer.
>>
>> I am sure that many of you make menus like this
>>
>> <ul id="menu">
>> <li><a href="page1.html">option 1</a></li>
>> <li><a href="page2.html">option 2</a></li>
>> <li><a href="page3.html">option 3</a></li>
>> <li><a href="page4.html">option 4</a></li>
>> </ul>
>>
>> and then add style like this
>>
>> #menu li:hover {background-color: #123456;}
>>
>> Below is a little function I "developed" (stole, copied and adapted)
>> that can create this hover effect in IE.
>>
>> To make it work, write the body tag as follows:
>> <body onload="hoverer('menu');">
>>
>> function hoverer(ulname) {
>> if (document.all && document.getElementById(ulname).currentStyle ) {
>> var navroot = document.getElementById(ulname);
>> var lis=navroot.getElementsByTagName("li");
>> for (i=0; i<lis.length; i++) {
>> var oldClassName = this.className;
>> lis[i].onmouseover=function() {this.className = ulname + "ie";}
>> lis[i].onmouseout=function() {this.className = oldClassName;}
>> }
>> }
>> }
>>
>> any comments / questions greatly appreciated.
>>
>> - Nicolaas
>
> That's great but if you need javascript, why not just use onmouseover?
The reason I used the javascript is because if you have a really long menu,
it keeps the html clean (without any mouseovers).
Having said that, I am now using dorayme's solution, because it seems a lot
smarter again!
Thank you
- Nicolaas
Navigation:
[Reply to this message]
|