我有一个页面，其中有一个元素在某些事件触发时会移动。我正在使用CSS3过渡来使其顺利运行。它在Firefox、Chromium（Google Chrome）、Safari（Windows）、Android浏览器（2.3.7）和Firefox Mobile for Android（又名Fennec）上运行良好。在InternetExplorer上，它忽略转换属性，只是按预期突然移动元素。
不过，它在Mobile Safari上不起作用。如果定义了-webkit-transition，则元素根本不会移动。我正在测试第一代iPod Touch，所以这可能只是旧版本的问题。我的iOS版本是3.1.3（7E18）。
JavaScript动画效果（通过jQuery）可以正常工作，但在上面提到的任何设备上都不能顺利运行。我宁愿使用CSS3解决方案。
这也是更新的iOS设备的问题吗？
是否记录并解释了问题？如果是，有人能提供链接吗？
附近有工作吗？
我创建了一个简单的测试页面来演示我的问题。正如我所说，除非删除-webkit-transition行，否则元素不会在Mobile Safari中移动。
<!doctype html>
<html>
<head>
<meta name="viewport" content="initial-scale=1">
<style type="text/css">
#box {
border: 3px outset gray;
font-size: xx-small;
color: silver;
background-color: black;
position: absolute;
width: 50px;
height: 50px;
top: 100px;
left: 220px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
}
a {
display: table-cell;
text-align: center;
vertical-align: middle;
color: black;
text-decoration: none;
width: 100px;
height: 100px;
background-color: silver;
border: 2px outset gray;
}
</style>
<script type="text/javascript">
var box;
window.onload = function(){
box = document.getElementById("box");
}
var getTop = function(obj){
var curtop = obj.offsetTop;
obj = obj.offsetParent;
while (obj){
curtop += obj.offsetTop;
obj = obj.offsetParent;
}
return curtop;
};
var moveUp = function(obj){
var curtop = getTop(obj);
obj.style.top = (curtop - 20) + "px";
return false;
};
var moveDown = function(obj){
var curtop = getTop(obj);
obj.style.top = (curtop + 20) + "px";
return false;
};
</script>
</head>
<body>
<div id="box">
<p>This is the box.</p>
</div>
<a href="#" onclick="return moveUp(box);">Move Up</a>
<a href="#" onclick="return moveDown(box);">Move Down</a>
</body>
</html>
谢谢。
你最好的选择是更新到iOS 5-更新的软件修复了旧的错误。。。这就是为什么我们都讨厌ie6:）
我刚刚检查了几个移动框架，它们的支持矩阵从iOS 3.2开始，还有几个列出了3.1.3作为它们不支持的第一个版本。
此外，您可能想尝试console.logging&从iOS safari调试控制台检查日志。您可能希望尝试绑定到触摸事件，而不是链接的默认单击处理程序。可能是那样的芬兰人。甚至链接中的哈希标记也可能导致问题。