juanbrujo/simple-background-parallax.html

## simple-background-parallax.html
<html>
  <head>
    <style>
      .bgParallax {
        background-image: url('image/background-jpg');
      	background-position: 50% 0;
      	background-repeat: repeat;
      	background-attachment: fixed;
      }
    </style>
  </head>
</html>
<body>
  <div class="bgParallax" data-speed="5">
       <article>
       	  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis et sint dolore aut atque, optio in dolores recusandae rerum quia id provident praesentium dolorum doloribus expedita qui velit ad.</p>
       </article>
  </div>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  <script>
    $('.bgParallax').each(function(){
    	var $obj = $(this);
    	$(window).scroll(function() {
    		var yPos = -($(window).scrollTop() / $obj.data('speed'));
    		var bgpos = '50% '+ yPos + 'px';
    		$obj.css('background-position', bgpos );
    	});
    });
  </script>
</body>
</html>
	<html>
	<head>
	<style>
	.bgParallax {
	background-image: url('image/background-jpg');
	background-position: 50% 0;
	background-repeat: repeat;
	background-attachment: fixed;
	}
	</style>
	</head>
	</html>
	<body>
	<div class="bgParallax" data-speed="5">
	<article>
	<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis et sint dolore aut atque, optio in dolores recusandae rerum quia id provident praesentium dolorum doloribus expedita qui velit ad.</p>
	</article>
	</div>
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
	<script>
	$('.bgParallax').each(function(){
	var $obj = $(this);
	$(window).scroll(function() {
	var yPos = -($(window).scrollTop() / $obj.data('speed'));
	var bgpos = '50% '+ yPos + 'px';
	$obj.css('background-position', bgpos );
	});
	});
	</script>
	</body>
	</html>