jQuery の mouseenter および mouseleave イベントを使用して、div を上下にスライドさせています。
マウスがdivから非常にゆっくりと移動した場合にのみ発生しないように見えるmouseleaveを除いて、すべてがうまく機能します。マウスを比較的通常または速い速度で動かすと、期待どおりに動作します。
誰かがこれを説明したり、これを回避する方法について情報を提供したりできますか?
コード:
$(document).ready(function() {
$('header').mouseenter(function() {
$(this).stop().animate({'top' : '25px'}, 500, function() {
$(this).delay(600).animate({'top' : '-50px'}, 500);
});
}).mouseleave(function(e) {
var position = $(this).position();
if (e.pageY > position.top + $(this).height()) {
$(this).stop().delay(600).animate({'top' : '-75px'}, 500) ;
}
});
});