Horizontal Parallax Scrolling from Scratch - No Plugin (jQuery)

Question

Does anyone know were I can find a tutorial for how to do horizontal parallax scrolling via js form scratch (i.e. no plug-in)? Or can provide me with an example

I\'ve sp

Answer 1

The code from @PezCuckow's answer but without jQuery (i.e. purely in java script): http://jsfiddle.net/Gurmeet/s26zxcnf/1/

HTML:

JS:

var strength1 = 50;
var strength2 = 100;
var strength3 = 200;

var background = document.getElementById('background');
var middleground = document.getElementById('middleground');
var foreground = document.getElementById('foreground');

function update(e){
var pageX = e.clientX - (window.innerWidth / 2);
var pageY = e.clientY - (window.innerHeight / 2);
background.style.backgroundPosition = (strength1 / window.innerWidth * pageX * -1)+"px "+(strength1  / window.innerHeight * pageY * -1)+"px";
middleground.style.backgroundPosition = (strength2 / window.innerWidth * pageX * -1)+"px "+(strength2  / window.innerHeight * pageY * -1)+"px";
foreground.style.backgroundPosition = (strength3 / window.innerWidth * pageX * -1)+"px "+(strength3  / window.innerHeight * pageY * -1)+"px";

};