diff --git a/README.md b/README.md index 01c665c..f016b8a 100644 --- a/README.md +++ b/README.md @@ -27,7 +27,7 @@ A smooth 3D tilt javascript library forked from [Tilt.js (jQuery version)](https scale: 1, // 2 = 200%, 1.5 = 150%, etc.. speed: 300, // Speed of the enter/exit transition transition: true, // Set a transition on enter/exit. - axis: null, // What axis should be disabled. Can be X or Y. + axis: null, // What axis should be disabled. Can be 'x' or 'y'. reset: true // If the tilt effect has to be reset on exit. easing: "cubic-bezier(.03,.98,.52,.99)", // Easing on enter/exit. glare: false // if it should have a "glare" effect diff --git a/dist/vanilla-tilt.babel.js b/dist/vanilla-tilt.babel.js index 7c05991..01dd079 100644 --- a/dist/vanilla-tilt.babel.js +++ b/dist/vanilla-tilt.babel.js @@ -155,7 +155,7 @@ var VanillaTilt = function () { VanillaTilt.prototype.update = function update() { var values = this.getValues(); - this.element.style.transform = "perspective(" + this.settings.perspective + "px) " + "rotateX(" + (this.settings.axis === "x" ? 0 : values.tiltY) + "deg) " + "rotateY(" + (this.settings.axis === "y" ? 0 : values.tiltX) + "deg) " + "scale3d(" + this.settings.scale + ", " + this.settings.scale + ", " + this.settings.scale + ")"; + this.element.style.transform = "perspective(" + this.settings.perspective + "px) " + "rotateX(" + (this.settings.axis === "y" ? 0 : values.tiltY) + "deg) " + "rotateY(" + (this.settings.axis === "x" ? 0 : values.tiltX) + "deg) " + "scale3d(" + this.settings.scale + ", " + this.settings.scale + ", " + this.settings.scale + ")"; if (this.glare) { this.glareElement.style.transform = "rotate(" + values.angle + "deg) translate(-50%, -50%)"; diff --git a/dist/vanilla-tilt.js b/dist/vanilla-tilt.js index e17462f..b08c135 100644 --- a/dist/vanilla-tilt.js +++ b/dist/vanilla-tilt.js @@ -148,8 +148,8 @@ class VanillaTilt { let values = this.getValues(); this.element.style.transform = "perspective(" + this.settings.perspective + "px) " + - "rotateX(" + (this.settings.axis === "x" ? 0 : values.tiltY) + "deg) " + - "rotateY(" + (this.settings.axis === "y" ? 0 : values.tiltX) + "deg) " + + "rotateX(" + (this.settings.axis === "y" ? 0 : values.tiltY) + "deg) " + + "rotateY(" + (this.settings.axis === "x" ? 0 : values.tiltX) + "deg) " + "scale3d(" + this.settings.scale + ", " + this.settings.scale + ", " + this.settings.scale + ")"; if (this.glare) { diff --git a/lib/vanilla-tilt.es2015.js b/lib/vanilla-tilt.es2015.js index e392872..9c4a1fd 100644 --- a/lib/vanilla-tilt.es2015.js +++ b/lib/vanilla-tilt.es2015.js @@ -145,8 +145,8 @@ class VanillaTilt { let values = this.getValues(); this.element.style.transform = "perspective(" + this.settings.perspective + "px) " + - "rotateX(" + (this.settings.axis === "x" ? 0 : values.tiltY) + "deg) " + - "rotateY(" + (this.settings.axis === "y" ? 0 : values.tiltX) + "deg) " + + "rotateX(" + (this.settings.axis === "y" ? 0 : values.tiltY) + "deg) " + + "rotateY(" + (this.settings.axis === "x" ? 0 : values.tiltX) + "deg) " + "scale3d(" + this.settings.scale + ", " + this.settings.scale + ", " + this.settings.scale + ")"; if (this.glare) { diff --git a/lib/vanilla-tilt.js b/lib/vanilla-tilt.js index 0972e7a..7308248 100644 --- a/lib/vanilla-tilt.js +++ b/lib/vanilla-tilt.js @@ -154,7 +154,7 @@ var VanillaTilt = function () { VanillaTilt.prototype.update = function update() { var values = this.getValues(); - this.element.style.transform = "perspective(" + this.settings.perspective + "px) " + "rotateX(" + (this.settings.axis === "x" ? 0 : values.tiltY) + "deg) " + "rotateY(" + (this.settings.axis === "y" ? 0 : values.tiltX) + "deg) " + "scale3d(" + this.settings.scale + ", " + this.settings.scale + ", " + this.settings.scale + ")"; + this.element.style.transform = "perspective(" + this.settings.perspective + "px) " + "rotateX(" + (this.settings.axis === "y" ? 0 : values.tiltY) + "deg) " + "rotateY(" + (this.settings.axis === "x" ? 0 : values.tiltX) + "deg) " + "scale3d(" + this.settings.scale + ", " + this.settings.scale + ", " + this.settings.scale + ")"; if (this.glare) { this.glareElement.style.transform = "rotate(" + values.angle + "deg) translate(-50%, -50%)"; diff --git a/src/vanilla-tilt.js b/src/vanilla-tilt.js index b1dc5fb..8f312cf 100644 --- a/src/vanilla-tilt.js +++ b/src/vanilla-tilt.js @@ -145,8 +145,8 @@ export default class VanillaTilt { let values = this.getValues(); this.element.style.transform = "perspective(" + this.settings.perspective + "px) " + - "rotateX(" + (this.settings.axis === "x" ? 0 : values.tiltY) + "deg) " + - "rotateY(" + (this.settings.axis === "y" ? 0 : values.tiltX) + "deg) " + + "rotateX(" + (this.settings.axis === "y" ? 0 : values.tiltY) + "deg) " + + "rotateY(" + (this.settings.axis === "x" ? 0 : values.tiltX) + "deg) " + "scale3d(" + this.settings.scale + ", " + this.settings.scale + ", " + this.settings.scale + ")"; if (this.glare) {