Попытка создать простой эффект параллакса в 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'); 
    }); 
    }); 
});