試圖在jQuery中創建一個簡單的視差效果

Question

我正在學習JS和JQ，我正在研究一個簡單的視差效果，我需要幫助才能讓他正確。這裏是代碼：http://codepen.io/ronka/pen/JGxxBb。

$(document).ready(function(){ 
    $('section[data-type="parallax"]').each(function(){ 
    var $bgobj = $(this); 
    $(window).scroll(function(){ 
     var $yPos = -($(window).scrollTop()- $bgobj.offset().top); 
     console.log($(this)); 
     $bgobj.css('background-position','50% ' + $yPos +'px'); 
    }); 
    }); 
}); 

正如您在滾動時看到的那樣，您會看到紅色背景。我不希望它只顯示紅色背景圖像。解決辦法是什麼？

Answer 1

嘗試用這樣的

$(document).ready(function(){ 
    $('section[data-type="parallax"]').each(function(){ 
    var $bgobj = $(this); 
    $(window).scroll(function(){ 
     var yPos = $(window).scrollTop(); 
     $bgobj.css('background-position','50% -' + (yPos*0.4) +'px'); 
    }); 
    }); 
});