【问题标题】:jquery animate (height) causes background-image flickering in firefoxjquery animate (height) 导致背景图像在 Firefox 中闪烁
【发布时间】:2010-02-02 11:12:53
【问题描述】:

我在使用 jQuery.animate 和 firefox 时遇到了一点问题:当我使用一些背景图像为容器的高度设置动画时,背景仅在 firefox 上开始闪烁 - 所有其他浏览器(甚至 ie)都显示流畅的动画。一个简化的代码 sn-p 显示我在做什么:

<div style="background-image:url(image.jpg);background-position:50% 50%;height:200px;"
      onmouseover="jQuery(this).animate({height:400});"></div>

非常感谢您的帮助。

【问题讨论】:

  • 它目前在我们的本地开发服务器上,但我将在今天晚些时候上传一个演示

标签: jquery firefox jquery-animate


【解决方案1】:

出于兴趣,如果您将其包装在另一个 DIV 中并为其设置动画会发生什么,例如

<div style="background-position:50% 50%;height:200px;" onmouseover="jQuery(this).animate({height:400});">
     <div style="background-image:url(image.jpg);"></div>
</div>

(作为记录,我使用了您的代码,但更喜欢使用 CSS 类和 Late jQuery 事件绑定 ;-)

【讨论】:

  • 我当然使用后期绑定/css 类,但我想保持示例简短 ;)
  • 哦,感谢您的提示 - 将 height:100% 添加到内部 div 效果很好
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2018-12-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-01-20
  • 2013-10-20
  • 2014-03-19
相关资源
最近更新 更多