CSS3中的transition在火狐浏览器中的细微抖动是怎么回事??
<!DOCTYPE html>
<html>
<head>
    <title>Local</title>
</head>
<style type="text/css">
*{padding: 0;margin: 0}
.piont{width: 20px;height: 20px;border-radius: 50%;background: red;margin-top: 200px;margin-left: 200px;border: 6px solid #999;-moz-transition:all 0.2s ease 0s;transition:all 0.2s ease 0s;}
.piont:hover{border: 20px solid #eee;margin-top: 186px;margin-left: 186px;-moz-transition:all 0.2s ease 0s;transition:all 0.2s ease 0s;}
</style>
<body>

<div class="piont"></div>

</body>
</html>

在谷歌浏览器中正常,在火狐狸中心点随动画抖动!怎么解决这个抖动的问题?请高手赐教!

2个回答

我也刚刚察觉到这个问题,百度到你这来了,无论是opacity,还是transform的动画属性只要加上transition过渡,图片就会闪动;
而且只有firefox有这个bug。不知道该怎么解决。
你现在解决了吗?如果有什么方法不妨分享一下。

-webkit-backface-visibility: hidden;-webkit-transform-style: preserve-3d;

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐