Danswerme 2020-08-09 15:48:16 +08:00 1970 次点击
这是一个创建于 1901 天前的主题，其中的信息可能已经有所发展或是发生改变。
操作系统：win10
Chrome: 84.0.4147.105
用 Chrome 调试移动端网页时会出现如下情况，但是真机上没有此问题，Firefox 也无此问题，仅在 chrome 调试移动端网页时会出现这种情况。
当页面上某个元素使用了任意包含 transform 的动画后，页面上其他使用了任意定位的元素就会变模糊；即使动画并无发生(例如 0%和 100%都使用相同的值)，元素仍然也会变模糊。
相关代码如下:
@keyframes avatar_rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(359deg); } } .avatar { animation: avatar_rotate 66s linear infinite; width: 44px; height: 44px; } .text { position: relative; } <div class="wrap"> <img src="https://cdn.v2ex.com/avatar/7460/e1cd/274090_large.png" class="avatar"> <p class="text">测试文字测试文字测试文字</p> </div>  | 1 Pyrex23 2020-08-09 16:50:03 +08:00 via iPhone  1 之前也遇到了类似的问题 不过我用的是 translate 查了一下 网上说是数值是小数的问题 |
 | 2 wxsm 2020-08-09 18:35:46 +08:00 via iPhone 1 调试器坑很多，以真机为准 |
 | 3 jiemowang 2020-08-10 10:16:35 +08:00 画面传输问题,问了节省带宽,把不重要的部分压缩传输了,真机上应该是清晰的 |
Select Language