由于 WebKit 中的 jQuery 动画而产生的盒子阴影伪像

发布于 2025-01-08 00:24:18 字数 290 浏览 0 评论 0原文

当我尝试将 jQuery 动画方法应用于带有框阴影的浮动块时,WebKit 中出现了一些工件(我正在 Chrome 18 和 19 中进行测试)。

box-shadow artifact

测试用例: 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).

box-shadow artifact

Test case:
http://jsfiddle.net/JxBKM/

Are anybody knows how to prevent this?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

心凉 2025-01-15 00:24:19

因此,我更新了您的 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.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文