我可以让这段代码在 Chrome 中运行，但不能在 IE (Internet Explorer) 中运行。是否可以将一些东西迁移到其他浏览器作为浏览器交叉兼容性？
<html>
<head>
</head>
<body>
<style>#move{position:absolute;height:100px;width:100px;background-color:cyan}</style>
<script>
var ok=document.createElement("div");
document.body.appendChild(ok);
ok.setAttribute("id","move");
function jobson(a){
switch(a){
case 0:
setInterval(function(){
if(ok.style.backgroundColor="black")ok.style.backgroundColor="cyan"},1);
break;
};
setInterval(function(){
if(ok.style.backgroundColor="cyan")ok.style.backgroundColor="black";ok.style.left
(a)+"px";},1);
//distancia
};
setInterval(function(){
for(var i=0;i<1000;i++){
jobson(i);
};},1);
</script>
</body>
</html>
最佳答案
您正在使浏览器内存过载并导致它崩溃，因为您每 1 毫秒调用一次 setTimeout。
改变这个(每 1 毫秒):
setInterval(function () {
for (var i = 0; i < 1000; i++) {
jobson(i);
};
}, 1);
对此(每 100 毫秒):
setInterval(function () {
for (var i = 0; i < 1000; i++) {
jobson(i);
};
}, 100);
如果您想要一个只有 CSS3 的解决方案:
CSS:
#move {
position:absolute;
left:0px;
top:20px;
height:100px;
width:100px;
background-color:cyan;
animation:myanimation 1s;
-moz-animation:myanimation 1s;
-webkit-animation:myanimation 1s;
}
@keyframes myanimation {
from {
left: 0px;
}
to {
left:500px;
}
}
@-moz-keyframes myanimation {
from {
left: 0px;
}
to {
left:500px;
}
}
@-webkit-keyframes myanimation {
from {
left: 0px;
}
to {
left:500px;
}
}
关于javascript - 此代码在 Chrome 中有效，但在 Internet Explorer 中无效，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23555869/