Thanks for the help...I appreciate it.
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!
