悬停（）内的jQuery动画仅在第二次触发

我正在使用jQuery为悬停（）上的高度更改设置动画。悬停（）内的jQuery动画仅在第二次触发

悬停后，它将应用.hover类，点击后，它将切换一个.expanded类。它主要是在适当的动画下工作，但仅在第一次之后。第一次悬停将完全跳过动画。

我难住了 - 这里是有问题的代码：

$('#expandingbox').hover(

    /*on mouseenter, if not expanded, add hover class*/ 
    function() { 
    if (!$(this).hasClass("expanded")) { 
     $(this).stop(true, true).addClass("hover", "slow"); 
    }}, 

    /*on mouseout, if not expanded, remove hover class*/ 
    function() { 
    if (!$(this).hasClass("expanded")) { 
     $(this).stop(true, true).removeClass("hover", "slow"); 
    } 
}).click(function() { 
    $(this).toggleClass("expanded", "slow"); 
});

我发现的地方，加上$（“＃expandingbox”）的触发器（“鼠标移出”）将解决这个问题，但事实并非如此。为我工作。这里是一个例子重现问题： http://jsfiddle.net/Qc42v/

UPDATE： 提交了票，而且事实证明这是一个jQuery的错误。相同的代码适用于jQuery 1.5（以及最新版本的jQuery UI）。

来源

2011-06-11 joseph

你有没有考虑过使用[animate]（http://api.jquery.com/animate/）？ – ngen 2011-06-11 01:49:21

@ngen我想我应该继续使用有用的工具 - 我现在将使用animate（），并提交一个bug，就像@pixelfreak建议的那样。 – joseph 2011-06-11 01:55:38

这可能是一个合法的jQuery UI错误。事先添加一些随机类似乎为我解决了这个问题。检查：http://jsfiddle.net/Qc42v/9/

所以基本上是这样的：

/*on mouseenter, if not expanded, add hover class*/ 
function() { 
if (!$(this).hasClass("expanded")) { 
    $(this).addClass("xxx"); 
    $(this).stop(true, true).addClass("hover", "slow"); 
}},

如果这看起来对你来说太令人讨厌的，也许只是使用基本的动画（）函数？有人应该明确提出错误：{

来源

2011-06-11 01:41:56 pixelfreak

我不敢相信那些作品！你如何看待这样做？我想我会提交一个bug，然后尝试animate（）。我从来没有用过这个，所以这是我有时间学会的，我想！谢谢！ – joseph 2011-06-11 01:53:23

只是本能，我想:) 不客气！ – pixelfreak 2011-06-11 01:56:04

悬停（）内的jQuery动画仅在第二次触发

回答

相关问题