Ios-Parallax.js---A simple jQuery plugin that reproduces the moving background parallax effect in iOS using only HTML, CSS, and JS

Ios-Parallax.js is a simple jQuery plugin that reproduces the moving background parallax effect in iOS using only HTML, CSS, and JS.

GitHub here

Step1:
link bootstrap and cover style files in the head. (Here I'm with cover sample page of bootstrap)

head

And jquery,bootstrap and ios-parallax js files at the body bottom.

body

Step2:
The html layout and cover.css copied from bootstrap sample page.

html

And the outer layer named bg contains the background picture(the size of picture for better view is 2560x1080)

css

• If you're defining the background-image property in a separate css file, make sure the CSS file is loaded before calling $.iosParallax();

Step3:

js

$('#myContainer').iosParallax({

  // How fast the background moves

  movementFactor: 50,

  // How much to dampen the movement (higher is slower)

  dampenFactor: 36

   

});