Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

cleaned up source

  • Loading branch information...
commit 4c6b22f6a23818aa11318d93857c4c1f86c82187 1 parent c45605f
Stephen Murphy authored
Showing with 10 additions and 12 deletions.
  1. +10 −12 js/parallaxer.js
22 js/parallaxer.js
View
@@ -3,12 +3,14 @@
this._stage = stage;
this._transitioning = false;
this._lastCursor = null;
+ this._xRange = 0.1; // Move at most 1/10 window width in x direction
+ this._yRange = 0.2; // Move at most 1/5 window height in y direction
window.addEventListener('devicemotion', this._onDeviceMove.bind(this), true);
window.addEventListener('mousemove', this._onMouseMove.bind(this), true);
}
- Parallaxer.TRANSITION = 'all .08s linear';
+ Parallaxer.TRANSITION = 'all .01s linear';
Parallaxer.TRANSITION_DIST_SQ = 200 * 200; // Minimum distance before applying a smooth transition effect
Parallaxer.prototype = {
@@ -17,7 +19,6 @@
},
_transition: function() {
- console.log('TRANSITION');
this._transitioning = true;
this._stage.style.WebkitTransition = Parallaxer.TRANSITION;
window.addEventListener('webkitTransitionEnd', this._onEndTransition.bind(this), true);
@@ -29,11 +30,12 @@
},
_onMouseMove: function(e) {
- var cursor = {x: e.clientX, y: e.clientY},
- win = {width: window.innerWidth, height: window.innerHeight},
- stage = {width: this._stage.offsetWidth, height: this._stage.offsetHeight};
+ var cursor = {x: e.clientX, y: e.clientY};
- if (this._lastCursor && !this._transitioning) {
+ if (!this._lastCursor) { // Transition to initial mouse coordinates
+ this._transition();
+ }
+ else if (!this._transitioning) { // Transition if distance between mouse events is large
var dx = cursor.x - this._lastCursor.x,
dy = cursor.y - this._lastCursor.y;
@@ -41,15 +43,11 @@
this._transition();
}
}
- else {
- this._transition();
- }
- var x = -(cursor.x / win.width - 0.5) * stage.width * 0.1,
- y = -(cursor.y / win.height - 0.5) * stage.height * 0.2;
+ var x = -(cursor.x / window.innerWidth - 0.5) * window.innerWidth * this._xRange,
+ y = -(cursor.y / window.innerHeight - 0.5) * window.innerHeight * this._yRange;
this._stage.style.WebkitTransform = 'translate(' + x + 'px,' + y + 'px)';
-
this._lastCursor = cursor;
}
};
Please sign in to comment.
Something went wrong with that request. Please try again.