微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

hover()中的jQuery动画仅在第二次触发

我正在使用jQuery在hover()上设置高度变化的动画.

在悬停时,它将应用.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,remove hover class*/
    function() {
    if (!$(this).hasClass("expanded")) {
        $(this).stop(true,true).removeClass("hover","slow");
    }
}).click(function() {
    $(this).toggleClass("expanded","slow");
});

我找到了添加$(‘#expandingBox’)的地方.触发器(‘mouSEOut’)将解决这个问题,但它对我不起作用.
这是一个重现问题的例子:
http://jsfiddle.net/Qc42v/

更新:
提交了一张票,结果证明这是一个jQuery错误.相同的代码适用于jQuery 1.5(以及最新版本的jQuery UI).

解决方法

这可能是一个合法的jQuery UI错误.事先添加一些随机类似乎可以解决它.检查: http://jsfiddle.net/Qc42v/9/

所以基本上是这样的:

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

如果这看起来太难吃了,也许只使用基本的animate()函数?有人应该肯定提交一个bug:{

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐