Question

我正在使用Animate.css并尝试分配持续时间，延迟和循环选项，但该命令被忽略。我认为这是因为propertyName未被识别，因此被忽略。我想将它应用于元素，而不是使用信息将标签附加到正文。

.css(
  {
    "-vendor-animation-duration": "7s", 
    "-vendor-animation-delay": "2s", 
    "-vendor-animation-iteration-count": "infinite"
  }
);

有没有办法强迫它添加一些它无法识别的东西？

更新 - 添加一个示例，它看起来很乱，但它都是使用jquery作为预览动态添加的。稍后它将从数据库中调用并分配。

<div data-layer="0" data-type="sliderLayer" data-slide="0" 
data-positioningtypewidth="px" data-positioningtypeheight="px" 
data-positioningtypeleft="px" data-positioningtypetop="px" data-id="0" 
class="resizable draggable canvasItem sliderLayer-0 slide-0 draggable-0 
ui-draggable ui-draggable-handle ui-resizable bounce.slide animated" 
style="background-color: rgb(204, 17, 102); z-index: 100; animation-duration: 
1000ms; opacity: 0.88; display: block; width: 455px; height: 115px; border-
radius: 25.15px; background-size: 50px 50px; background-image: -moz-linear-
gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 
50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 
75%, transparent); box-shadow: 0px 0px 8px rgb(119, 61, 161);">

Answer 1

如果元素上没有使用其他内联样式，您可以使用attr函数设置内联样式

.attr("style","-vendor-animation-duration: 7s;-vendor-animation-delay: 2s; -vendor-animation-iteration-count: infinite;");

编辑：

如果已经应用了内联样式，您可以尝试在css中为类定义这些规则，然后使用jQuery添加该类

<style>
    .vendor-animation {
        -vendor-animation-duration: 7s; 
        -vendor-animation-delay: 2s; 
        -vendor-animation-iteration-count: infinite;
    }
</style>
<script>
    $('#element').addClass('vendor-animation');
</script>

使用jquery .css（）添加自定义样式名称

1 个答案: