有没有办法只使用CSS在固定元素中滚动背景图像？

Question

我有两个带有背景图像的固定元素，我希望滚动页面，而不滚动元素。这是jsfiddle：http://jsfiddle.net/3s3qu2yv/

有没有办法在纯CSS中实现这一点？我知道有一种方法可以做到这一点javascript但我想尽可能避免这种情况。

Answer 1

不确定你在这里问的是什么。看起来你已经在你的小提琴中完成了这个。

其他背景为background-attachment属性，使其与元素一起滚动。

这通常用于parralax网站。

Answer 2

只有CSS才能做到这一点，你需要使用JavaScript。这个jQuery确切地说：

http://jsfiddle.net/3s3qu2yv/4/ - 更新以更好地说明我想要的效果。

function scr() {
   var scrolled = $(window).scrollTop();
   $('.fx').css('background-position', 'center -' + scrolled + 'px');
}

$( document ).ready(function() {
   $(window).scroll(function(){
      scr();
   });
});

固定元素的背景无法随页面滚动，无论背景附件是设置为fixed还是scroll，因为元素本身不会移动。