2

我目前在这里设置我的延迟：

.isotope .isotope-item {
    -webkit-transition-property: left, top, opacity;
    -moz-transition-property: left, top, opacity;
    -ms-transition-property: left, top, opacity;
    -o-transition-property: left, top, opacity;
    transition-property: left, top, opacity;
    -webkit-transition-delay: 0s, 0.8s, 0s;
    -moz-transition-delay: 0s, 0.8s, 0s;
    -ms-transition-delay: 0s, 0.8s, 0s;
    -o-transition-delay: 0s, 0.8s, 0s;
    transition-delay: 0s, 0.8s, 0s;
}

我在 jQuery 中有一个条件语句，需要能够像这样更改我的延迟：

.isotope .isotope-item {
    -webkit-transition-delay: 2s, 0.8s, 0s;
    -moz-transition-delay: 2s, 0.8s, 0s;
    -ms-transition-delay: 2s, 0.8s, 0s;
    -o-transition-delay: 2s, 0.8s, 0s;
    transition-delay: 2s, 0.8s, 0s;
}

任何想法，如果这可能实现或任何其他解决方案来解决这个问题？

4

2 回答 2

4

jQuery 可以很好地处理供应商前缀。

$(".isotope-item").css('-webkit-transition-delay', '2s, 0.8s, 0s' )
   .css('-moz-transition-delay', '2s, 0.8s, 0s')
   .css('-ms-transition-delay', '2s, 0.8s, 0s')
   .css('-o-transition-delay', '2s, 0.8s, 0s')
   .css('transition-delay', '2s, 0.8s, 0s');

如果您不想像 Rory 建议的那样添加新课程，它将起作用。

http://jsfiddle.net/qzuDr/

于 2012-05-24T21:48:19.973 回答
4

在您的情况下，将另一个类添加到需要较长延迟的元素中，例如foo，然后将您的第二种样式更改为：

.isotope .isotope-item.foo {
    -webkit-transition-delay: 2s, 0.8s, 0s;
    -moz-transition-delay: 2s, 0.8s, 0s;
    -ms-transition-delay: 2s, 0.8s, 0s;
    -o-transition-delay: 2s, 0.8s, 0s;
    transition-delay: 2s, 0.8s, 0s;
}

更高的特异性将确保这些元素接收更长的延迟时间。

于 2012-05-24T21:40:33.440 回答