jQuery UI Hover repeating -
i have html:
<div> <div id="wrap"> <div id="pop">hello</div> here content <br /> several lines long. <br /> end of it. </div> </div>
and javascript:
$(function() { $('#wrap').hover(function() { $('#pop', $(this)).show('blind'); }, function() { $('#pop', $(this)).hide('blind'); }); });
using jquery ui.
if move mouse on #wrap div #pop slides down , slides away again when mouse out. if move mouse #wrap above or move #wrap #pop before animation finishes loops forever (if wait till animation finishes, can move between #wrap , #pop freely , nothing animates, want).
i've tried combinations of mouseover
, mouseenter
/mouseleave
, filtering .not(':animated')
, calling .stop()
before each call show
/hide
, of give same result leads me believe i'm missing fundamental.
could point me in direction of i'm missing here?
thanks
the hover callbacks don't work show('blind')
, hide('blind')
, should work ok slideup()/slidedown()
.
$(function() { $('#wrap').hover(function() { console.log('over'); $('#pop').slidedown(); }, function() { console.log('out'); $('#pop').slideup(); }); });
also, i'm not seeing infinite looping, animations queued up. if move mouse pointer in , out of #wrap you'll generate long string of animations.
edit:
i able infinite loop in ff.
Comments
Post a Comment