Firefox 8 Problem in firing mouseover event

Sometime back we created a feature of  highlight text(each word is inside a div) when user moves mouse while keeping left button pressed.A few days ago firefox has launched its new version 8.0,and we are getting the complain of breaking the highlight functionality in firefox 8 while in all other versions it was runing fine .
After digging into code i found that firefox 8 is preventing the mouseover event to fire on subseuent divs when a user left clicks and start draging from a div with its overflow set to hidden or auto.

To better understand it lets have an example :-



function doMouseover(e,obj)
{
 if (!e) var e = window.event;
 obj.style.backgroundColor = 'yellow';
}
function doMouseout(e,obj)
{
 if (!e) var e = window.event;
 obj.style.backgroundColor = '#ffffcc';
}
function doMove(e)
{
 if (!e) var e = window.event;
 return false;
}


body {
 background-color: #ccddee;
 height: 100%;
 width: 100%;
 padding: 0px;
 margin: 0px;
}
div.box {
 margin-left: 100px;
 margin-top: 30px;
 background-color: #ffffcc;
 color: black;
 border: solid black 1px;
 width: 200px;
 height: 40px;
}
div.dragstart {
 position: absolute;
 left: 400px;
 top: 50px;
 width: 200px;
 height: 100px;
 border: solid black 1px;
 color: black;
 background-color: #ddeeff;
 overflow: auto;
 padding: 5px;
}
div.dragstart2 {
 position: absolute;
 left: 400px;
 top: 200px;
 width: 200px;
 height: 100px;
 border: solid black 1px;
 color: black;
 background-color: #ddeeff;
        overflow: hidden;
 padding: 5px;
}
div.dragstart3 {
 position: absolute;
 left: 400px;
 top: 350px;
 width: 200px;
 height: 100px;
 border: solid black 1px;
 color: black;
 background-color: #ddeeff;
        overflow: visible;
 padding: 5px;
}






 overflow:auto in this DIV


 overflow:hidden in this DIV


overflow:visible in this DIV


 


 


 


 


 
go to the top blue div on the right, and “click & drag” from there to the yellow divs ( press the mouse button while on the blue div then move the mouse to the yellow divs without releasing the button).The mouseover event appears to not fire – the brighter yellow does not show up.

Same is true for the second blue div from top having overflow as hidden.

what happens here is that when you click on the div with overflow:auto/hidden AND , it prevents mouseover events on OTHER divs from firing.

Workaround for the problem:- Just set the overflow of divs having text inside as visible,you wil see that mouseover events starts firing

Example :- Click & drag from the bottom blue div, and you should see the brighter yellow of the mouseover

150 150 Burnignorance | Where Minds Meet And Sparks Fly!