Forum Moderators: not2easy
I had my SOS working quite nicely in IE6, but it has recently messed up for some reason. It appears when I rollover, but when I try to move my mouse down to the menu items in the dropdown, it disappears. I believe this is because the only area in which the dropdown is being "hovered" over is the actual text, and not a div, and because of the padding around the words in the original menu, there seems to be a space of "no hover" in between the menu li and the menu li ul's which the dropdown assumes a rollout has occured. If this is confusing, take a look [umedplans.com]. The only dropdown is for "Products." Does anyone have any idea which of the css items I should be altering to increase the rollover area of the dropdown menu item?
P.S. It is working in FF, but I am running a separate style sheet for IE. [umedplans.com ]
<!-- calling the script -->
<li onMouseOver="show('products_dropdown')" onMouseOut="hide('products_dropdown')">
Products
<ul id="products_dropdown">
<li>
productlink
</li>
</ul>
</li>
The mouseover behavior is on the outer li, which contains the ul. Use padding to increase the clickable area to make sure that the li and ul clickable areas overlap.
Works in FF, Safari, IE6.
Hope that helps!