JS动画缩放背景图像

Question

我想重复这个效果： http://www.google.com/culturalinstitute/#!home（在chrome中查看，图像在2-3秒后开始缩放）

我尝试使用jquery animate和background-size属性执行此操作：

$(document).ready(function(){
  $('.bg').animate({'background-size':'105%'}, 5000)
})

但是每个流行的浏览器中的图像都是退缩

感谢任何帮助

Answer 1

如果使用内嵌图像而不是背景图像，它应该更加平滑。使用z-index来解决内容重叠问题。

所以你将动画制作一个img：

$(document).ready(function(){
  $('.bg').animate({'width':'105%'}, 5000);
})

这是一个例子 - ＆gt; http://jsfiddle.net/frUvf/