CSS3的animation在chrome里运行出现【怪现象】_html/css_WEB-ITnose
- WBOY원래의
- 2016-06-21 09:39:321157검색
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>HTML5</title><style type="text/css">#a3{width:50px; height:50px; background-color:#000066;margin:200px 0 0 200px;color:#FFF;}@-webkit-keyframes aa1{ 0%{-webkit-transform:rotate(0deg) scale(1,1) skew(0deg,0deg);opacity:1;} 50%{-webkit-transform:rotate(180deg) scale(2,2) skew(45deg,0deg);opacity:0;} 100%{-webkit-transform:rotate(360deg) scale(1,1) skew(0deg,0deg);opacity:1;}}@-moz-keyframes aa1{ 0%{-moz-transform:rotate(0deg) scale(1,1) skew(0deg,0deg);opacity:1;} 50%{-moz-transform:rotate(180deg) scale(2,2) skew(45deg,0deg);opacity:0;} 100%{-moz-transform:rotate(360deg) scale(1,1) skew(0deg,0deg);opacity:1;}}.a3:hover{ -webkit-animation-name:aa1; -webkit-animation-duration:5s; -webkit-animation-timing-function:linear; -webkit-animation-iteration-count:infinite; -moz-animation-name:aa1; -moz-animation-duration:5s; -moz-animation-timing-function:linear; -moz-animation-iteration-count:infinite;}.a5{ -webkit-animation-name:aa1; -webkit-animation-duration:5s; -webkit-animation-timing-function:linear; -webkit-animation-iteration-count:infinite; -moz-animation-name:aa1; -moz-animation-duration:5s; -moz-animation-timing-function:linear; -moz-animation-iteration-count:infinite;}</style></head><body><div id="a3">123456</div></body><script>var a = document.getElementById("a3");a.addEventListener("click",function(){ //alert("a5"); //a.style.cssText = "-webkit-animation-name:aa1;-webkit-animation-duration:5s;-webkit-animation-timing-function:linear;-webkit-animation-iteration-count:infinite;"; a.className = "a5";});</script></html> 这段代码的意义是，当点击屏幕上的小方块（DIV）时，小方块会自动旋转和拉伸并改变透明度，这段代码在firefox里面运行正常，但是在chrome里运行出现问题：
1.只有透明度在转化，旋转和拉伸没有；
2.当前面加一行alert的代码时，点击确定关掉弹出窗口时，能正常运行；
chrome版本 22.0.1229.96
请问各位大神这是什么个情况，有什么解决办法，总不能无端的加个alert吧……
回复讨论(解决方案)
。。。我表示all OK LZ赶紧重装吧
额。。。你的JS咋都写到body外面去了 太嚣张了 难怪出错
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.