fiddle here - 目标是在滚动时在背景上产生一些透视效果。
它在 Chrome、IE7、IE8 上运行良好,但是:
它在 IE9 上运行异常(背景在 animation
之前重置其位置)
它不适用于 Mozilla 和 Opera(滚动有效但背景位置无效)
它在鼠标滚轮事件被触发时动画滚动页面,它动画背景位置比 body 滚动多一点,这给人以透视感
最佳答案
要解决 IE9(和 Mozilla 等)的问题,请从“background-position-x”中删除“-x”。它不再被现代浏览器使用,因为它不是任何标准规范的一部分。如果你想用 jQuery 的 animate 方法改变背景位置,你必须同时包含 X 和 Y 属性。
$('div').animate({'background-position':'0px 50px'});
-OR-
$('div').animate({'background-position':'50px 0px'});
background-position-x 和 background-position-y 是 Microsoft 在旧版 IE 中实现的 css 元素。谷歌的人喜欢这个想法并采纳了它。我相信 Chrome 仍然可以让你拆分属性,但我不会指望它 :) 最后,这与“不要指望它”的情况一起出现,你不必包含“px”尺寸。有些元素不需要零值,但有些浏览器似乎在 javascript 中需要它。
关于jquery - 动画背景位置在浏览器上的工作方式不同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14080731/