Hmmm, no luck so far using the target condition but I found a workaround using hover instead of mouseout:
$('div.a').hover(function() {},function() { $(this).children('span.b').hide(); }); On Jun 13, 6:20 pm, "Jonathan Sharp" <[EMAIL PROTECTED]> wrote: > (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!