jQuery hover（）仅在鼠标移动时触发

Question

我有一个按钮可以在悬停时改变不透明度：（工作正常）

$('#btn').hover(function() {
    $(this).animate({'opacity':1},100);
}, function() {
    $(this).animate({'opacity':.8},100);
});

当按下它时，它会向下移动：（也能正常工作）

$('#btn').on('click',function(){
    $(this).animate({'margin-top':'-100px'},400);
});

问题：当按钮移动时，它会远离悬停区域，但第一个悬停状态仍处于活动状态（只有当鼠标悬停在按钮上时才能激活第一个悬停状态）。但是，如果我从那里移动鼠标，第二个状态会触发jquery注意鼠标移动。

即使没有移动鼠标，有没有办法让hover（）触发？

Answer 1

使用$(this).trigger("mouseout")

这将导致正确的hover()处理程序触发。

演示：http://jsfiddle.net/alan0xd7/va87ff96/

Answer 2

如果我理解得很好，问题是移动后悬停状态仍然有效。

那么为什么不为动画添加不透明度呢？

$('#btn').on('click',function(){
    $(this).animate({'opacity':.8,'margin-top':'-100px'},400);
});

DEMO