插入css动画浏览器javascript

Insert css animation internet explorer javascript

本文关键字:javascript 浏览器 动画 css 插入      更新时间:2023-09-26

我想在internet explorer中插入一个javascript动画。似乎行不通。用铬,没有问题。请查看这些链接:

var style = document.documentElement.appendChild(document.createElement("style")),
rule="@keyframes test{ 0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}} ";
style.sheet.insertRule(rule);
$(".mojo")[0].style["animation"] = " test 3s ease-out both infinite";
http://jsfiddle.net/273e2/17/

是动画工作与IE10。在运行时插入动画似乎不工作。

insertRule方法需要两个值;第一个是新规则字符串,第二个是您希望将其添加到其他规则中的索引。

0的索引将把该规则推到顶部,而等于规则总数的索引将把该规则推到底部。

// Add a new rule to the bottom of the first stylesheet
sheet.insertRule( rule, sheet.rules.length );

将此索引添加到演示中可以修复此问题:http://jsfiddle.net/273e2/19/show/