Level Extreme platform
Subscription
Corporate profile
Products & Services
Support
Legal
Français
Replacement for detecting onmouseout
Message
From
18/04/2016 06:14:00
 
 
To
17/04/2016 20:25:57
General information
Forum:
Javascript
Category:
Other
Miscellaneous
Thread ID:
01634911
Message ID:
01634918
Views:
33
I remember reading about inconsistent onmouseout behaviour and CSS - pretty certain it was on Ricks site.

>Onmouseout event does not trigger all the times if the mouse is moving too fast.
>
>The only way to get around that is to use top CCS styles that will act accordingly, such as visibility on or off of a specific item. This works well if you only have one DIV for example. But, if you have specific logic that request two div to have the visible style to become hidden at the same time, then it becomes difficult to use CSS for that.
>
>So, basically, what I have now is this. Two DIVs are shown on the page. When the logic determines that one of the two needs to become hidden, the code will take care of the two by doing pretty much the same logic to make them invisible. But, the problem with handling that by code is if the mouse is moved too fast. This is a known issue of javascript and very difficult to work around.
>
>Anyone would have an idea on how to have someting working?
>
>For example, the answer on that page suggests to use CCS to benefit of high level hover detection:
>
>http://stackoverflow.com/questions/10626429/onmouseout-event-not-triggered-when-moving-mouse-fast-gwt-all-browsers
>
>As long as this is a single DIV, it works. But, if you have a more complex logic, I really do not think CSS can handle it on its own.
>
>For example, my mouse out event has something like this:
>
>
>function OnMouseOutNew(event)
>{
>   var e=event.toElement || event.relatedTarget
>   while(e && e.parentNode && e.parentNode != window)
>   {
>      if (e.parentNode==oDiv || e==oDiv || e.parentNode==oDiv0 || e==oDiv0)
>      {
>         if(e.preventDefault) e.preventDefault()
>         {
>            return false
>         }
>      }
>      e=e.parentNode
>   }
>   DeactivateMenuNew()
>   return true
>}
>
>function DeactivateMenuNew()
>{
>   oDiv.style.visibility="hidden"
>   oDiv.style.display="none"
>   oDiv0.style.visibility="hidden"
>   oDiv0.style.display="none"
>   oToolbarImage.style.opacity=1
>}
>
>
>But, the mouse out event does not fire if this is too fast.
Previous
Next
Reply
Map
View

Click here to load this message in the networking platform