7

我正在使用一系列 CSS3 转换,但对于较旧的机器,通过使用 JQuery UI 添加和删除类进行备份。

JQuery UI addClass 动画功能齐全。然而,JQuery UI removeClass 没有动画,而是延迟了动画时间,然后跳转到前一个类的属性。

$('.box').addClass('adds', 800); ANIMATING CORRECTLY
$('.box').removeClass('adds', 800); NOT ANIMATING AT ALL

.box {
    background:#CCC;
    border:1px solid #222;
    height:200px;
    width:200px;
}
.adds {
    height:220px !important;
    width:400px !important;
}

我已经设置了一个小提琴,但由于某种原因,这个小提琴什么也没做,不知道为什么。http://jsfiddle.net/aA9LN/4/

有任何想法吗?

奇妙

4

2 回答 2

9

好像removeClass不喜欢这个!important关键字。这是关于 jsbin 的演示:http: //jsbin.com/idorud

您可能希望以某种方式重写.adds类,例如,删除!important关键字并为 css 选择器添加特异性#someId div.adds,例如.

于 2011-07-05T15:38:55.300 回答
0

您可以通过使用 jquery.animate函数来解决此问题来完成相同的事情。

$('.box').addClass('adds', 800); //same as before

//now instead, use .animate to transition back with effect
$('.box').animate({ 'height': '220px', 'width': '200px' }, 800);
$('.box').removeClass('adds'); //then just remove the class without any effects
于 2013-05-02T21:36:02.927 回答