(untested) You need to do:
$('div.a').mouseout(function(e) {
if (e.target == this) {
$(this).children('span.b').hide();
}
});
Cheers,
-js
On 6/13/07, wswilson <[EMAIL PROTECTED]> wrote:
Here is my code:
<html>
<head>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('div.a span.b').hide();
$('div.a h1').mouseover(function() {$(this).next('span.b
').show();});
$('div.a').mouseout(function() {$(this).children('span.b
').hide();});
});
</script>
<style type="text/css">
.a h1, span.b
{
display: inline;
}
</style>
</head>
<body>
<div class="a">
<h1>text</h1>
<span class="b">text</span>
</div>
</body>
</html>
I am expecting that span.b will only show when I mouseover the h1 and
then hide when I leave div.a. However, it hides as soon as I leave h1.
How is mouseout on div.a called when I still seem to be in div.a?
Thanks!
