奇怪的动画行为

2013-05-01 121 views 0 likes

$('li').on({ 
    'mouseover':fadeImgOut, 
    'mouseout' :fadeImgIn 
});

和功能...

function fadeImgOut() { 
    $(this).find('img').animate({opacity:'.5'}, 1000); 
} 
function fadeImgIn() { 
    $(this).find('img').animate({opacity:'1'}, 1000); 
}

当我将鼠标悬停在其上时，图像fadeout, fadein and fadeout，当我移动鼠标移出，图像fadein, fadeout and fadein再次。

我无法解释这种行为：为什么图像不会在mouseover上消失，并在mouseout上消失？

来源

2013-05-01 Lior Elrom

将其更改为鼠标离开/的mouseenter和使用的stop（） – epascarello 2013-05-01 02:42:30

回答

使用

$('li').on({ 
    'mouseenter':fadeImgOut, 
    'mouseleave' :fadeImgIn 
});

或者更好

$('li').hover(fadeImgOut, fadeImgIn)

来源

2013-05-01 02:42:55

工作！为什么mouseenter/mouseleave在工作，mouseover/mouseout不是？ – 2013-05-01 02:45:11

将鼠标指针移动到子元素时，'li> mouseout'会被触发，但只有当您将元素移动到外部元素时才会触发'mouseleave'。 – 2013-05-01 02:48:21

有意义。谢谢！ – 2013-05-01 02:49:02

奇怪的动画行为

回答

相关问题