Dropdown/Overlapping problem hovering from below

[parboy]

1) Script Title: Drop down/ Overlapping Content script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...lapcontent.htm

3) Describe problem: script works fine - if I hover over the dropdown link image, the pop-up appears... except when the cursor hovers over the image coming from below it. In that case, about 20% of the pop-up appears and then disappears.



Thanks.

[ddadmin]

The reason the drop down DIV prematurely disappears sometimes when you move the mouse in from the bottom of the anchor image becomes more clear if you give the anchor a background color to see just what's included by the anchor:

<style>

#michelin{
background:green;
}

</style>

With the above you should see how the anchor (in this case a DIV) doesn't actually fully engulf the icon inside it, but just partially. So when you move your mouse in from the bottom of the anchor, it hits the green area but then the icon itself (resulting in a mouseout action), causing the revealing DIV to reverse course.

The solution would be either to register the icon itself as the anchor (instead of the parent DIV), or modify the CSS for the later in a way so that it surrounds the child icon snuggly (with no green area showing afterwards).

[parboy]

ddadmin,

Problem Solved! Thanks for the simple explanation and possible solutions. For the record, I chose the 1st approach of identifying the icon as the anchor instead of the containing div. An easy fix requiring only a minor style change after the div's ID was moved inside to the img tag.