From 0605ab13dfc525fa1498a53833b83a1ad1612fa0 Mon Sep 17 00:00:00 2001
From: Luke Karrys <lukekarrys@gmail.com>
Date: Fri, 29 Nov 2013 10:57:26 -0700
Subject: [PATCH] add parallax horizontal and vertical properties to enable
 non-calculated parallax offsets

---
 README.md    | 13 +++++++++++--
 js/reveal.js | 32 ++++++++++++++++++++++++++------
 2 files changed, 37 insertions(+), 8 deletions(-)

diff --git a/README.md b/README.md
index f224e5e8..20d2e4c5 100644
--- a/README.md
+++ b/README.md
@@ -164,6 +164,10 @@ Reveal.initialize({
 	// Parallax background size
 	parallaxBackgroundSize: '' // CSS syntax, e.g. "2100px 900px"
 
+	// Amount to move parallax background (horizontal and vertical) on slide change
+	// Number, e.g. 100
+	parallaxBackgroundHorizontal: '',
+	parallaxBackgroundVertical: ''
 
 });
 ```
@@ -371,7 +375,7 @@ Backgrounds transition using a fade animation by default. This can be changed to
 
 ### Parallax Background
 
-If you want to use a parallax scrolling background, set the two following config properties when initializing reveal.js (the third one is optional).
+If you want to use a parallax scrolling background, set the first two config properties below when initializing reveal.js (the other three are optional).
 
 ```javascript
 Reveal.initialize({
@@ -383,7 +387,12 @@ Reveal.initialize({
 	parallaxBackgroundSize: '', // CSS syntax, e.g. "2100px 900px" - currently only pixels are supported (don't use % or auto)
 
 	// This slide transition gives best results:
-	transition: linear
+	transition: linear,
+
+	// Amount to move parallax background (horizontal and vertical) on slide change
+	// This is optional, if this isn't specified it will be calculated automatically
+	parallaxBackgroundHorizontal: '', // A number, e.g. 100
+	parallaxBackgroundVertical: ''    // A number, e.g. 10
 
 });
 ```
diff --git a/js/reveal.js b/js/reveal.js
index 98d802e4..d8dc6bc6 100644
--- a/js/reveal.js
+++ b/js/reveal.js
@@ -107,6 +107,10 @@ var Reveal = (function(){
 			// Parallax background size
 			parallaxBackgroundSize: '', // CSS syntax, e.g. "3000px 2000px"
 
+			// Amount to move parallax background (horizontal and vertical) on slide change
+			parallaxBackgroundHorizontal: '', //  Number, e.g. 100
+			parallaxBackgroundVertical: '', // Number, e.g. 10
+
 			// Number of slides away from the current that are visible
 			viewDistance: 3,
 
@@ -2026,13 +2030,29 @@ var Reveal = (function(){
 				backgroundHeight = parseInt( backgroundSize[1], 10 );
 			}
 
-			var slideWidth = dom.background.offsetWidth;
-			var horizontalSlideCount = horizontalSlides.length;
-			var horizontalOffset = -( backgroundWidth - slideWidth ) / ( horizontalSlideCount-1 ) * indexh;
+			var slideWidth = dom.background.offsetWidth,
+				horizontalSlideCount = horizontalSlides.length,
+				horizontalOffsetMultiplier, horizontalOffset;
 
-			var slideHeight = dom.background.offsetHeight;
-			var verticalSlideCount = verticalSlides.length;
-			var verticalOffset = verticalSlideCount > 0 ? -( backgroundHeight - slideHeight ) / ( verticalSlideCount-1 ) * indexv : 0;
+			if (typeof config.parallaxBackgroundHorizontal === 'number') {
+				horizontalOffsetMultiplier = config.parallaxBackgroundHorizontal;
+			} else {
+				horizontalOffsetMultiplier = ( backgroundWidth - slideWidth ) / ( horizontalSlideCount-1 );
+			}
+
+			horizontalOffset = horizontalOffsetMultiplier * indexh * -1;
+
+			var slideHeight = dom.background.offsetHeight,
+				verticalSlideCount = verticalSlides.length,
+				verticalOffsetMultiplier, verticalOffset;
+
+			if (typeof config.parallaxBackgroundVertical === 'number') {
+				verticalOffsetMultiplier = config.parallaxBackgroundVertical;
+			} else {
+				verticalOffsetMultiplier = ( backgroundHeight - slideHeight ) / ( verticalSlideCount-1 );
+			}
+
+			verticalOffset = verticalSlideCount > 0 ?  verticalOffsetMultiplier * indexv * -1 : 0;
 
 			dom.background.style.backgroundPosition = horizontalOffset + 'px ' + verticalOffset + 'px';