simple parallax effect
HTML
<div class="bg"></div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
CSS
.bg {
width: 100%;
height: 200px;
background: url('//placekitten.com/1000/300') no-repeat;
border: 1px solid red;
}
JavaScript
$(window).scroll(function() {
var scrolledY = -3 * $(window).scrollTop() / 2;
$('.bg').css('background-position', 'left ' + (scrolledY) + 'px');
});