firefox rotate过渡效果的问题
在做一个div：hover{transform:rotatey(180deg)}的过渡效果时，在别的流览器都正常，只有在火狐下，鼠标非得跟上元素移动，才正完成180度翻转...
在做一个div：hover{transform:rotatey(180deg)}的过渡效果时，在别的流览器都正常，只有在火狐下，鼠标非得跟上元素移动，才正完成180度翻转。当转到90度时，元素成了一条线，这时更是难翻过去。求解决方案。
代码如下:
<html>
<head>
<style>
div{
width:200px;
height:100px;
background-color:red;
transition:2s;
-moz-transition:2s;
-webkit-transition:2s;
-ms-transition:2s;
}
div:hover{
transform:rotatey(180deg);
-moz-transform:rotatey(180deg);
-webkit-transform:rotatey(180deg);
-ms-transform:ratatey(180deg);
}
</style>
</head>
<body>
<div>aaa</div>
</body>
</html> 展开
代码如下:
<html>
<head>
<style>
div{
width:200px;
height:100px;
background-color:red;
transition:2s;
-moz-transition:2s;
-webkit-transition:2s;
-ms-transition:2s;
}
div:hover{
transform:rotatey(180deg);
-moz-transform:rotatey(180deg);
-webkit-transform:rotatey(180deg);
-ms-transform:ratatey(180deg);
}
</style>
</head>
<body>
<div>aaa</div>
</body>
</html> 展开
1个回答
展开全部
应该是兼容问题，在火狐下用Firebug调试一下看看，错误部分应该会有提示，优先执行W3C标准这样火狐下基本不会有问题，然后再针对其他浏览器做兼容，这样操作比较方便。
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
