jQuery頁腳div使用主體滾動值的視差滾動效果

Question

我堅信，使用“ body” scrollTop（）更改背景位置，對頁腳“ div”背景進行輕微的視差效果很簡單

這是我的試用，但是頁腳“ div”的背景沒有變化。 我在這里看不到我在做什么錯：

HTML就像

<body>
<div class="footer_parallax"></div>
</body>

$('body').scroll(function(){
var x = $(this).scrollTop();
$('.footer_parallax').css('background-position','0% '+parseInt(-x/10)+'px');
});

此處的codepen： http ://codepen.io/ssstofff/pen/zxXyMp

Answer 1

由於Codepen使用iframe，因此我認為通過body標簽獲取滾動元素存在一些問題。 當我將其更改為window它可以工作。

這是完整的代碼段（CSS方法符號已更改）：

$(window).scroll(function(){

  var x = $(this).scrollTop();

  $('.footer_parallax').css({'background-position': '0% '+parseInt(-x/10)+'px'});

});