fadeOut() actually sets display:none at the end of the animation, so when this happens it triggers the onmouseout event.
Try using the fadeTo() function (http://docs.jquery.com/Effects), it keeps the element in place: $("a").hover( function() { $(this).css("background", "white").fadeTo(500,0); },function() { $(this).css("background", "black").fadeTo(100,1); }); And make sure your <a> doesn't have any child elements, otherwise the hover function will be called repeatedly on mouse move. - ricardo On Sep 29, 8:42 pm, backdoc <[EMAIL PROTECTED]> wrote: > I'm brand new to jQuery. And, I'm wanting to make something fadeOut > when I hover or mouseover and fadeIn when I mouseout. I tried the two > methods below. But, when I leave the mouse cursor positioned over the > element, I get an unwanted blink effect. It seems that when the > fadeOut() ends, it triggers the next method. I wouldn't expect that. > > I figure this is probably jQuery 101. But, I couldn't find the answer > in the archives. > > Any suggestions? > > TIA, > backdoc > > <script type="text/javascript"> > $(document).ready(function() { > $("a").click(function(e) { > e.preventDefault; > //alert("Hello world!"); > }); > $("a").hover( > function(e) { > $(this).css("background", "white"); > $(this).fadeOut(500); > }, > function(e) { > $(this).css("background", "black"); > $(this).fadeIn(100); > }); > /* > $("a").mouseover( > function(e) { > //alert(this.id); > $(this).css("background", "yellow"); > $(this).fadeOut(500); > }); > $("a").mouseout( > function(e) { > $(this).css("background", "black"); > $(this).fadeIn(100); > }); > */ > }); > </script>
