Chrome使用background-size的性能不佳：封面
我需要覆盖网站中的背景，并且在鼠标悬停或任何其他操作时总是看到滞后/slugs。您知道如何解决这个问题吗？ 我这里有一个工作示例（如果我还没有更新代码）： http://natgeo.geryit.com
ul#posters li {
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
float: left;
height: 170px;
position: relative;
width: 25%;
}
I need to cover background in my site and I always see lags/slugs on mouse over or any other action. Do you have any idea how to fix this issue?
I have a working example here (If I didnt update the code yet) : http://natgeo.geryit.com
ul#posters li {
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
float: left;
height: 170px;
position: relative;
width: 25%;
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
看来 webkit 不会缓存调整大小的图像并每次都渲染它，从而导致延迟。
当谈到 Chrome 中的背景大小时，你就不走运了。
我见过有人用 Javascript / jQuery 来做这件事。请参阅http://srobbin.com/jquery-plugins/jquery-backstretch/
It appears webkit doesn't cache the resized image and renders it every time, causing the lag.
You're out of luck when it comes to background-size in chrome.
I've seen people do it with Javascript / jQuery. See http://srobbin.com/jquery-plugins/jquery-backstretch/