Merge pull request jlmakes#46 from pazguille/master

julianlloyd · julianlloyd · commit a1323750cd07 · 2014-05-25T20:31:36.000-07:00
Decouple the scroll event from _scrollPage function using requestAnimationFrame.
diff --git a/dist/scrollReveal.js b/dist/scrollReveal.js
@@ -39,6 +39,20 @@ window.scrollReveal = (function (window) {
 
   'use strict';
 
+  /**
+   * RequestAnimationFrame polyfill
+   * @function
+   * @private
+   */
+  var requestAnimFrame = (function () {
+    return window.requestAnimationFrame ||
+      window.webkitRequestAnimationFrame ||
+      window.mozRequestAnimationFrame ||
+      function (callback) {
+        window.setTimeout(callback, 1000 / 60);
+    };
+  }());
+
   function scrollReveal(options) {
 
       this.docElem = window.document.documentElement;
@@ -90,12 +104,13 @@ window.scrollReveal = (function (window) {
         self.update(el);
       });
 
-      var scrollHandler = function () {
+      var scrollHandler = function (e) {
+        // No changing, exit
         if (!self.scrolled) {
           self.scrolled = true;
-          setTimeout(function () {
-            self._scrollPage();
-          }, 60);
+          requestAnimFrame(function () {
+            self._scrollPage
+          });
         }
       };
 
@@ -112,6 +127,7 @@ window.scrollReveal = (function (window) {
         self.resizeTimeout = setTimeout(delayed, 200);
       };
 
+      // captureScroll
       window.addEventListener('scroll', scrollHandler, false);
       window.addEventListener('resize', resizeHandler, false);
     },
diff --git a/dist/scrollReveal.min.js b/dist/scrollReveal.min.js
diff --git a/scrollReveal.js b/scrollReveal.js
@@ -31,6 +31,20 @@ window.scrollReveal = (function (window) {
   // generator (increments) for the next scroll-reveal-id
   var nextId = 1;
 
+  /**
+   * RequestAnimationFrame polyfill
+   * @function
+   * @private
+   */
+  var requestAnimFrame = (function () {
+    return window.requestAnimationFrame ||
+      window.webkitRequestAnimationFrame ||
+      window.mozRequestAnimationFrame ||
+      function (callback) {
+        window.setTimeout(callback, 1000 / 60);
+    };
+  }());
+
   function scrollReveal(options) {
 
       this.docElem = window.document.documentElement;
@@ -87,12 +101,13 @@ window.scrollReveal = (function (window) {
         self.update(el);
       });
 
-      var scrollHandler = function () {
+      var scrollHandler = function (e) {
+        // No changing, exit
         if (!self.scrolled) {
           self.scrolled = true;
-          setTimeout(function () {
-            self._scrollPage();
-          }, 60);
+          requestAnimFrame(function () {
+            self._scrollPage
+          });
         }
       };
 
@@ -109,6 +124,7 @@ window.scrollReveal = (function (window) {
         self.resizeTimeout = setTimeout(delayed, 200);
       };
 
+      // captureScroll
       window.addEventListener('scroll', scrollHandler, false);
       window.addEventListener('resize', resizeHandler, false);
     },
