jquery - keep animated element visible on mouse over -



jquery - keep animated element visible on mouse over -

i using code panel , image name slide out below image:

$( ".image-wrapper a" ).on 'mouseenter', -> $(this).next('.panel').animate bottom: "-40px" , 300 homecoming $( ".image-wrapper a" ).on 'mouseleave', -> $(this).next('.panel').animate bottom: "0px" , 300 homecoming

right when mouseover .panel slide because of mouseleave event on tag.

how can maintain panel open on mouseenter of tag , when on panel , maintain behavior of mouseleave event?

here's fidddle

http://jsfiddle.net/d5e40mw8/4/

try code: coffee script:

$(".image-wrapper img,.panel").mouseenter -> $(".panel").stop().animate bottom: -40 , 300 homecoming $(".image-wrapper img,.panel").mouseleave -> $(".panel").stop().animate bottom: 0 , 300 homecoming

enter ".image-wrapper img" , ".panel" elements animate ".panel" (i added .stop() animate evade animation bugs). if leave elements ".panel" hide again.

jquery mouseevent

Comments

Popular posts from this blog

Delphi change the assembly code of a running process -

json - Hibernate and Jackson (java.lang.IllegalStateException: Cannot call sendError() after the response has been committed) -

C++ 11 "class" keyword -