Search code examples
javascripthtmlgoogle-chromedojodom-events

dojo/on with mouseenter, mouseleave not working in Google Chrome

I have problem with dojo/on and handling mouseenter and mouseleave. It doesn't work for me... I prepared sample code:

<!doctype html>
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.8/dojo/dojo.js" data-dojo-config="async: 1"></script>
    </head>
    <body>
        <div id="test">TEST</div>
    </body>
</html>
<script type="text/javascript">
require(["dojo/dom", "dojo/on","dojo/domReady!"], function(dom, on) {
    on(dom.byId('test'), 'mouseenter', function() { alert('12'); });
});
</script>

If you will try to open it in Chrome it does not work, although if you open it in Opera, FF or IE it works just fine. Am I doing something wrong or there is any other way to use on mouseenter and mouseleave? over and out works in Chrome but would like to stay with enter and leave.

Solution

  • Use Extension Events of dojo/mouse module:

    require(["dojo/dom", "dojo/on", "dojo/mouse"], function(dom, on, mouse) {

    on(dom.byId('test'), mouse.enter, function() { alert('12'); });

});

    See how it works in this jsFiddle: http://jsfiddle.net/phusick/gUNuC/