JQuery активен при наведении только тогда, когда мышь находится на div

Таким образом, у меня есть нижний колонтитул слайдов, но если я хожу быстро с помощью мыши над div, это происходит просто скачок div, но я хочу также отображать содержимое, я создал видео ЗДЕСЬ: http://screencast. com/t/CDQUDQP3, чтобы вы могли понять это лучше, если я навещу мышью немного медленнее, он работает нормально.

Вот мой код:

var $footer = $('footer'), $footerHeader = $('.footer-header'), $footerDisplay = $('.footer-display'), $totalHeight = ((parseInt($footerDisplay.css('height'))) + 50)+'px';
$('footer').stop(1,1).hover(function(){ //mouse in $footerHeader.css('visibility','hidden'); $footerDisplay.stop(1,1).slideUp(function(){ $(this).show(); $footer.css('height',$totalHeight); }); $footer.stop(1,1).animate({'margin-top':'-'+$totalHeight});
},function(){ //mouse out $footer.stop(1,1).animate({'margin-top': '-57px','height':'57px'}); $footerDisplay.stop(1,1).slideUp(); $footerHeader.css('visibility','visible');
});

И HTML:

<footer> <div> <h3> OPEN </h3> </div><!--end footer-header--> <div> <!--?php dynamic_sidebar("the_footer"); ?--> </div><!-- end footer-display-->
</footer>
1 ответ

Вам нужен hoverIntent, плагин jquery. из документов:

hoverIntent - это плагин, который пытается определить намерение пользователя... как хрустальный шар, только с движением мыши! Он работает как (и был получен из) встроенного зависания jQuery. Однако вместо немедленного вызова функции onMouseOver он ждет, пока пользовательская мышь не замедлит работу до совершения вызова.

прочитайте больше и загрузите его здесь.

licensed under cc by-sa 3.0 with attribution.