Skip to content

Instantly share code, notes, and snippets.

@mocheng

mocheng/demoMouseOut.html

Created February 28, 2011 06:59
Show Gist options
  • Save mocheng/847023 to your computer and use it in GitHub Desktop.
Save mocheng/847023 to your computer and use it in GitHub Desktop.
Download ZIP
In YUI pre-2.8.0, there is no "mouseleave" event. So, it is pretty awkward to detect whether mouse is moving out of a element with nested children nodes.
Raw
demoMouseOut.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Test</title>
<link rel="stylesheet" type="text/css" href="/yui/assets/yui.css?v=3" >
<script src="http://yui.yahooapis.com/combo?2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"</script>
<!-- Browser History Manager source file -->
<style type="text/css" media="screen">
#outer {
height: 500px;
width: 500px;
padding: 100px;
background: gray;
}
#inner {
height: 200px;
width: 200px;
background: white;
}
</style>
</head>
<body class="yui-skin-sam">
<div id="outer">
<div id="inner"></div>
</div>
<script type="text/javascript" charset="utf-8">
(function() {
var YUE = YAHOO.util.Event,
YUD = YAHOO.util.Dom;
var container = document.getElementById('outer');
YUE.on(container, 'mouseout', function(e) {
var relatedTarget = YUE.getRelatedTarget(e);
if (!YUD.isAncestor(this, relatedTarget) && (relatedTarget != this)) {
alert(YUE.getRelatedTarget(e));
}
});
}());
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment