app内加载html页面,页面内有rotate属性,在android内可以旋转,但是在ios内不能旋转,js内的alert(n)和alert(123)都执行了,请问是兼容问题么?还有怎么解决?手机是iPhone5s
android中都可以,ios中不行
好像是兼容的问题,提取出的demo在safari中不能执行,chrome中可以,请问可以解决么?
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>hello World</title>
<style>
#pointer{
animation:run 2.5s linear forwards;
-webkit-animation:run 2.5s linear forwards; /* Safari 和 Chrome */
}
</style>
</head>
<script type="text/javascript">
function aa(){
var n = 3;
var rotate = 60 * n + 1080;
var keyframe = "@-webkit-keyframes run{0% {transform:rotate(0deg);-webkit-transform:rotate(0deg);}\n" +
"100%{transform:rotate(" + rotate + "deg);-webkit-transform:rotate(" + rotate + "deg);}}";
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = keyframe;
document.getElementById('pointer').appendChild(style);
}
</script>
<body>
<div id="pointer" style="height:100px;width:100px;background:red;position:absolute;left:300px;top:300px;" onclick="aa()">
</div>
</body>
</html
按照这样是可以的,代码如下: