Add reverse option

README.md

@@ -17,6 +17,7 @@ A smooth 3D tilt javascript library forked from [Tilt.js (jQuery version)](https
 ### Options
 ```js
 {
+    reverse:        false,  // reverse the tilt direction
     max:            35,     // max tilt rotation (degrees)
     perspective:    1000,   // Transform perspective, the lower the more extreme the tilt gets.
     scale:          1,      // 2 = 200%, 1.5 = 150%, etc..

dist/vanilla-tilt.babel.js

@@ -11,7 +11,7 @@ var classCallCheck = function (instance, Constructor) {
  * Created by Șandor Sergiu (micku7zu) on 1/27/2017.
  * Original idea: https://github.com/gijsroge/tilt.js
  * MIT License.
- * Version 1.1.0
+ * Version 1.2.0
  */
 
 var VanillaTilt = function () {
@@ -35,6 +35,8 @@ var VanillaTilt = function () {
     this.element = element;
     this.settings = this.extendSettings(settings);
 
+    this.reverse = this.settings.reverse ? -1 : 1;
+
     this.addEventListeners();
   }
 
@@ -105,8 +107,8 @@ var VanillaTilt = function () {
     x = Math.min(Math.max(x, 0), 1);
     y = Math.min(Math.max(y, 0), 1);
 
-    var tiltX = (this.settings.max / 2 - x * this.settings.max).toFixed(2);
-    var tiltY = (y * this.settings.max - this.settings.max / 2).toFixed(2);
+    var tiltX = (this.reverse * (this.settings.max / 2 - x * this.settings.max)).toFixed(2);
+    var tiltY = (this.reverse * (y * this.settings.max - this.settings.max / 2)).toFixed(2);
 
     return {
       tiltX: tiltX,
@@ -149,6 +151,7 @@ var VanillaTilt = function () {
 
   VanillaTilt.prototype.extendSettings = function extendSettings(settings) {
     var defaultSettings = {
+      reverse: false,
       max: 35,
       perspective: 1000,
       easing: "cubic-bezier(.03,.98,.52,.99)",

dist/vanilla-tilt.js

@@ -5,7 +5,7 @@ var VanillaTilt = (function () {
  * Created by Șandor Sergiu (micku7zu) on 1/27/2017.
  * Original idea: https://github.com/gijsroge/tilt.js
  * MIT License.
- * Version 1.1.0
+ * Version 1.2.0
  */
 
 class VanillaTilt {
@@ -26,6 +26,8 @@ class VanillaTilt {
     this.element = element;
     this.settings = this.extendSettings(settings);
 
+    this.reverse = this.settings.reverse ? -1 : 1;
+
     this.addEventListeners();
   }
 
@@ -97,8 +99,8 @@ class VanillaTilt {
     x = Math.min(Math.max(x, 0), 1);
     y = Math.min(Math.max(y, 0), 1);
 
-    let tiltX = (this.settings.max / 2 - x * this.settings.max).toFixed(2);
-    let tiltY = (y * this.settings.max - this.settings.max / 2).toFixed(2);
+    let tiltX = (this.reverse * (this.settings.max / 2 - x * this.settings.max)).toFixed(2);
+    let tiltY = (this.reverse * (y * this.settings.max - this.settings.max / 2)).toFixed(2);
 
     return {
       tiltX: tiltX,
@@ -141,6 +143,7 @@ class VanillaTilt {
 
   extendSettings(settings) {
     let defaultSettings = {
+      reverse: false,
       max: 35,
       perspective: 1000,
       easing: "cubic-bezier(.03,.98,.52,.99)",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vanilla-tilt",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "A smooth 3D tilt javascript library forked from Tilt.js",
   "main": "lib/vanilla-tilt.js",
   "dist": "dist/vanilla-tilt.js",

src/vanilla-tilt.js

@@ -2,7 +2,7 @@
  * Created by Șandor Sergiu (micku7zu) on 1/27/2017.
  * Original idea: https://github.com/gijsroge/tilt.js
  * MIT License.
- * Version 1.1.0
+ * Version 1.2.0
  */
 
 export default class VanillaTilt {
@@ -23,6 +23,8 @@ export default class VanillaTilt {
     this.element = element;
     this.settings = this.extendSettings(settings);
 
+    this.reverse = this.settings.reverse ? -1 : 1;
+
     this.addEventListeners();
   }
 
@@ -94,8 +96,8 @@ export default class VanillaTilt {
     x = Math.min(Math.max(x, 0), 1);
     y = Math.min(Math.max(y, 0), 1);
 
-    let tiltX = (this.settings.max / 2 - x * this.settings.max).toFixed(2);
-    let tiltY = (y * this.settings.max - this.settings.max / 2).toFixed(2);
+    let tiltX = (this.reverse * (this.settings.max / 2 - x * this.settings.max)).toFixed(2);
+    let tiltY = (this.reverse * (y * this.settings.max - this.settings.max / 2)).toFixed(2);
 
     return {
       tiltX: tiltX,
@@ -138,6 +140,7 @@ export default class VanillaTilt {
 
   extendSettings(settings) {
     let defaultSettings = {
+      reverse: false,
       max: 35,
       perspective: 1000,
       easing: "cubic-bezier(.03,.98,.52,.99)",