Last active
August 29, 2015 14:16
-
-
Save vitorjustin/ef4f5134840e04a2bf38 to your computer and use it in GitHub Desktop.
scroll to snippet without framework dependency using requestAnimationFrame
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
;(function(window, document, undefined) { | |
// rAF polyfill | |
(function() { | |
var lastTime = 0; | |
var vendors = ['ms', 'moz', 'webkit', 'o']; | |
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { | |
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame']; | |
window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame']; | |
} | |
if (!window.requestAnimationFrame) { | |
window.requestAnimationFrame = function(callback, element) { | |
var currTime = new Date().getTime(); | |
var timeToCall = Math.max(0, 16 - (currTime - lastTime)); | |
var id = window.setTimeout(function() { callback(currTime + timeToCall); }, | |
timeToCall); | |
lastTime = currTime + timeToCall; | |
return id; | |
}; | |
} | |
if (!window.cancelAnimationFrame) { | |
window.cancelAnimationFrame = function(id) { | |
clearTimeout(id); | |
}; | |
} | |
}()); | |
var _isIE = function (obj) { | |
return navigator.userAgent.toLowerCase().indexOf('msie') !== -1 || navigator.userAgent.toLowerCase().indexOf('trident') !== -1; | |
}; | |
var _isFirefox = function(){ | |
return typeof InstallTrigger !== 'undefined'; | |
}; | |
var easing = { | |
// no easing, no acceleration | |
linear: function (t) { return t; }, | |
// accelerating from zero velocity | |
easeInQuad: function (t) { return t*t; }, | |
// decelerating to zero velocity | |
easeOutQuad: function (t) { return t*(2-t); }, | |
// acceleration until halfway, then deceleration | |
easeInOutQuad: function (t) { return t<0.5 ? 2*t*t : -1+(4-2*t)*t; }, | |
// accelerating from zero velocity | |
easeInCubic: function (t) { return t*t*t; }, | |
// decelerating to zero velocity | |
easeOutCubic: function (t) { return (--t)*t*t+1; }, | |
// acceleration until halfway, then deceleration | |
easeInOutCubic: function (t) { return t<0.5 ? 4*t*t*t : (t-1)*(2*t-2)*(2*t-2)+1; }, | |
// accelerating from zero velocity | |
easeInQuart: function (t) { return t*t*t*t; }, | |
// decelerating to zero velocity | |
easeOutQuart: function (t) { return 1-(--t)*t*t*t; }, | |
// acceleration until halfway, then deceleration | |
easeInOutQuart: function (t) { return t<0.5 ? 8*t*t*t*t : 1-8*(--t)*t*t*t; }, | |
// accelerating from zero velocity | |
easeInQuint: function (t) { return t*t*t*t*t; }, | |
// decelerating to zero velocity | |
easeOutQuint: function (t) { return 1+(--t)*t*t*t*t; }, | |
// acceleration until halfway, then deceleration | |
easeInOutQuint: function (t) { return t<0.5 ? 16*t*t*t*t*t : 1+16*(--t)*t*t*t*t; } | |
}; | |
function scrollTo(Y, duration, easingFunction, callback) { | |
var start = Date.now(), | |
elem = document.documentElement.scrollTop ? document.documentElement : document.body, | |
from = elem.scrollTop; | |
if (_isIE()) { | |
elem = document.documentElement; | |
} | |
if (_isFirefox()) { | |
elem = document.documentElement; | |
} | |
callback = typeof callback === 'function' ? callback : noop; | |
if(from === Y) { | |
callback(); | |
return; /* Prevent scrolling to the Y point if already there */ | |
} | |
function min(a,b) { | |
return a<b?a:b; | |
} | |
function scroll(timestamp) { | |
var currentTime = Date.now(), | |
time = min(1, ((currentTime - start) / duration)), | |
easedT = easingFunction !== undefined ? easingFunction(time) : time; | |
elem.scrollTop = (easedT * (Y - from)) + from; | |
if(time < 1) { | |
requestAnimationFrame(scroll); | |
} else { | |
if(callback) { | |
callback(); | |
} | |
} | |
} | |
requestAnimationFrame(scroll); | |
}; | |
window.scrollTo = scrollTo; | |
})(window, document); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The script logic was not developed by me, but I could not find the place where I got the code.