simpleParallax
Simple parallax jQuery plugin http://simpleparallax.responsive.su/
Usage
Include jQuery:
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>Add CSS style in head section:
<link rel="stylesheet" href="path/path/simpleparallax.css"> Include plugin's code:
<script src="js/jquery.simpleparallax.js"></script>Create markup:
<div class="parallax" data-speed="0.5" style="background-image: url(http://lorempixel.com/1920/1600/nature/2);"> ... </div>Call the plugin:
$(function(){ $(".parallax").simpleParallax(); })Install via bower
bower install simple-parallax Options
{ // The value can be overwritten via html5 attribute "data-speed" speed: 0.25, overlay: { // The value can be overwritten via html5 attribute "data-bg-color" bgColor: "rgba(0, 0, 0, 0)", // The value can be overwritten via html5 attribute "data-overlay-opacity" opacity: 0.5, // The value can be overwritten via html5 attribute "data-overlay-class" overlayClass: false } }
