need to make this code do a little more...

[Cadwalader]

Hello,

This is a wierd one: I am overhauling a site. The boss (who knows nothing about website design and programming--and doesn't want to know) has this script that some one wrote for one of his websites and he will not have a site up with out it. So I am stuck with putting this rainbow of a navbar at the top of everything I do. Anyway, it's onMouseOver events handling images in another table cell. It *was* powered by JS, but IE5.5 and IE6 seem to want to go back to the server everytime the script calls an image. Even though they are preloading (I proved this by putting everything on a floppy). So I found a work around using nothing but DOM's. Now it works fine. BUT! the boss wants the tabs that the mouse is not on to be gray, except for the one for the page you're on.

What I am having trouble with is how can I get an onMouseOver event to change things in 2 different cells?
Here is what I have so far...
(a functioning example of this code is at menshealth.ws/dhtml.html)

<table valign=&quot;center&quot; width=&quot;700px&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; border=&quot;0&quot;>
<tr>
<td border=&quot;0&quot; width=&quot;100&quot; onMouseOver=&quot;id0.style.visibility='';&quot; onMouseOut=&quot;id0.style.visibility='hidden';&quot; id=&quot;lnk&quot; align=&quot;center&quot;><a href=&quot;index.html&quot;><img src=&quot;images/hometab.gif&quot;></a></td>
<td border=&quot;0&quot; width=&quot;100&quot; onMouseOver=&quot;id1.style.visibility='';&quot; onMouseOut=&quot;id1.style.visibility='hidden';&quot; id=&quot;lnk&quot; align=&quot;center&quot;><a href=&quot;about.html&quot;><img src=&quot;images/aboutustab.gif&quot;></a></td>
<td border=&quot;0&quot; width=&quot;100&quot; onMouseOver=&quot;id2.style.visibility='';&quot; onMouseOut=&quot;id2.style.visibility='hidden';&quot; id=&quot;lnk&quot; align=&quot;center&quot;><a href=&quot;alf.html&quot;><img src=&quot;images/alftab.gif&quot;></a></td>
<td border=&quot;0&quot; width=&quot;100&quot; onMouseOver=&quot;id3.style.visibility='';&quot; onMouseOut=&quot;id3.style.visibility='hidden';&quot; id=&quot;lnk&quot; align=&quot;center&quot;><a href=&quot;hormone.html&quot;><img src=&quot;images/womentab.gif&quot;></a></td>
<td border=&quot;0&quot; width=&quot;100&quot; onMouseOver=&quot;id4.style.visibility='';&quot; onMouseOut=&quot;id4.style.visibility='hidden';&quot; id=&quot;lnk&quot; align=&quot;center&quot;><a href=&quot;compound.html&quot;><img src=&quot;images/mentab.gif&quot;></a></td>
<td border=&quot;0&quot; width=&quot;100&quot; onMouseOver=&quot;id5.style.visibility='';&quot; onMouseOut=&quot;id5.style.visibility='hidden';&quot; id=&quot;lnk&quot; align=&quot;center&quot;><a href=&quot;faq.html&quot;><img src=&quot;images/faq.gif&quot;></a></td>
<td border=&quot;0&quot; width=&quot;100&quot; onMouseOver=&quot;id6.style.visibility='';&quot; onMouseOut=&quot;id6.style.visibility='hidden';&quot; id=&quot;lnk&quot; align=&quot;center&quot;><a href=&quot;contact.html&quot;><img src=&quot;images/contactustab.gif&quot;></a></td></TR>
<TR style=&quot;z-index:2;position:relative;&quot;>
<td height=&quot;21px&quot; valign=&quot;top&quot;colspan=&quot;7&quot;><img style=&quot;position:absolute;left:0px&quot; src=&quot;images/bar.gif&quot;><div border=&quot;0&quot; id=&quot;id0&quot; onMouseOver=&quot;this.style.visibility='visible';&quot; onMouseOut=&quot;this.style.visibility='hidden';&quot; style=&quot;visibility:hidden;&quot; align=&quot;center&quot;><img style=&quot;position:absolute;left:0px&quot; align=&quot;left&quot; src=&quot;images/bar.gif&quot;></div>
<div border=&quot;0&quot; id=&quot;id1&quot; onMouseOver=&quot;this.style.visibility='visible';&quot; onMouseOut=&quot;this.style.visibility='hidden';&quot; style=&quot;visibility:hidden;&quot; align=&quot;center&quot;><img style=&quot;position:absolute;left:0px&quot; align=&quot;left&quot; src=&quot;images/aboutusbar.gif&quot;></div>
<div border=&quot;0&quot; id=&quot;id2&quot; onMouseOver=&quot;this.style.visibility='visible';&quot; onMouseOut=&quot;this.style.visibility='hidden';&quot; style=&quot;visibility:hidden;&quot; align=&quot;center&quot;><img style=&quot;position:absolute;left:0px&quot; align=&quot;left&quot; src=&quot;images/alfbar.gif&quot;></div>
<div border=&quot;0&quot; id=&quot;id3&quot; onMouseOver=&quot;this.style.visibility='visible';&quot; onMouseOut=&quot;this.style.visibility='hidden';&quot; style=&quot;visibility:hidden;&quot; align=&quot;center&quot;><img style=&quot;position:absolute;left:0px&quot; align=&quot;left&quot; src=&quot;images/womenbar.gif&quot;></div>
<div border=&quot;0&quot; id=&quot;id4&quot; onMouseOver=&quot;this.style.visibility='visible';&quot; onMouseOut=&quot;this.style.visibility='hidden';&quot; style=&quot;visibility:hidden;&quot; align=&quot;center&quot;><img style=&quot;position:absolute;left:0px&quot; align=&quot;left&quot; src=&quot;images/mensbar.gif&quot;></div>
<div border=&quot;0&quot; id=&quot;id5&quot; onMouseOver=&quot;this.style.visibility='visible';&quot; onMouseOut=&quot;this.style.visibility='hidden';&quot; style=&quot;visibility:hidden;&quot; align=&quot;center&quot;><img style=&quot;position:absolute;left:0px&quot; align=&quot;left&quot; src=&quot;images/faqbar.gif&quot;></div>
<div border=&quot;0&quot; id=&quot;id6&quot; onMouseOver=&quot;this.style.visibility='visible';&quot; onMouseOut=&quot;this.style.visibility='hidden';&quot; style=&quot;visibility:hidden;&quot; align=&quot;center&quot;><img style=&quot;position:absolute;left:0px&quot; align=&quot;left&quot; src=&quot;images/contactbar.gif&quot;></div>

</TR>


</table>



Unfortunately, this has to be done without using JS. DOM's controlling visibility seem to work great. I know, some people never notice that IE is running back to the server, but it's making that navbar run slow and look like junk. What matters is the boss is seeing it, and he's not happy with it.

I hope someone can help...I really appreciate any suggestions, hints, criticisms, and solutions. Thanks in advance... Hope I was of some help...
--OR--
Thanks for the help...
--Rich

 

[RISTMO]

I don't understand the problem. Things seem to work how it is. I don't see any gray. What do you[he] want to be gray?

Rick

 

[Cadwalader]

The tabs at the top. I know I have to make the images yet, but if I can get the visibilty thing that is going on now to apply to the tabs, I'd be in good shape. Hope I was of some help...
--OR--
Thanks for the help...
--Rich

 

[RISTMO]

I went to

http://www.menshealth.ws/dhtml.html.

There are images already and the rollovers seem to work fine. I can't think of anything that needs to be applied to them. Do you want to change the color of the tab when the mouse is over it? Am I going crazy???

Rick

 

[Cadwalader]

RISTMO,

yeah, that's it. change the color of the tabs onMouseOVer. But I can't figure out how to do it with out js, and without screwing everything up.

I'll write a nice article explaining exactly why I don't wast to use js for this, and how you can test it for yourself. I'll probably do that tonight (I just about have all the details in order for it).

Thanks for the help ;-)
Hope I was of some help...
--OR--
Thanks for the help...
--Rich