由于 WebKit 中的 jQuery 动画而产生的盒子阴影伪像
当我尝试将 jQuery 动画方法应用于带有框阴影的浮动块时,WebKit 中出现了一些工件(我正在 Chrome 18 和 19 中进行测试)。
测试用例: http://jsfiddle.net/JxBKM/
有人知道如何防止这种情况吗?
When I try to apply jQuery animate method to the float block near the one with box-shadow, some artifacts take a place in the WebKit (i'm testing in the Chrome 18 & 19).
Test case:
http://jsfiddle.net/JxBKM/
Are anybody knows how to prevent this?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
因此,我更新了您的 fiddle 以包含 animate:complete 函数。基本上它是动画完成时调用的函数。我组装的小提琴仅在第一次被调用时有效,因为它将背景设置为与最初不同的背景。无论出于何种原因,Chrome 不想执行动画然后再次设置 CSS。看一下你就会明白我的意思。它第一次有效,但随后的尝试则无效。
我建议使用盒子阴影的图像,或者改进小提琴以每次而不是第一次重置它。
So I updated your fiddle to include the animate:complete function. Basically it's a function called when the animation is completed. The fiddle I put together only works on the first time it's called though, because it's setting the background to something different than it initially was. For whatever reason Chrome doesn't want to do the animation then set the CSS again. Take a look and you'll see what I mean. It works the first time, but not subsequent attempts.
I recommend going with an image for box-shadow, or refining the fiddle to reset it every time rather than on the first time.