Last active
June 19, 2019 10:21
-
-
Save verticalgrain/853197a4cfb725e5bb5751deb0d1dbcc to your computer and use it in GitHub Desktop.
Simple throttled scroll event using standalone lodash throttle / debounce function
This file contains 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, undefined ) { | |
'use strict'; | |
// Cache elements | |
var $stickyTabbar = $( '.tabbar__bar' ), | |
$stickyTabbarParent = $( '.tabbar' ), | |
stickyTabbarClass = 'is-fixed'; | |
var stickyTabbarToggle = function(e) { | |
console.log( 'scrollwatch' ); | |
var scroll = $(window).scrollTop(); | |
var offSet = $stickyTabbarParent.offset(); | |
var offSetTop = offSet.top; | |
if ( scroll >= offSetTop ) { | |
$stickyTabbar.addClass( stickyTabbarClass ); | |
} else { | |
$stickyTabbar.removeClass( stickyTabbarClass ); | |
} | |
} | |
// Lodash throttle and debounce functions | |
function debounce(t,e,n){function r(e){var n=b,r=v;return b=v=void 0,d=e,y=t.apply(r,n)}function o(t){return d=t,g=setTimeout(u,e),p?r(t):y}function i(t){var n=t-j,r=t-d,o=e-n;return O?nativeMin(o,m-r):o}function a(t){var n=t-j,r=t-d;return void 0===j||n>=e||0>n||O&&r>=m}function u(){var t=now();return a(t)?f(t):void(g=setTimeout(u,i(t)))}function f(t){return g=void 0,T&&b?r(t):(b=v=void 0,y)}function c(){void 0!==g&&clearTimeout(g),d=0,b=j=v=g=void 0}function l(){return void 0===g?y:f(now())}function s(){var t=now(),n=a(t);if(b=arguments,v=this,j=t,n){if(void 0===g)return o(j);if(O)return g=setTimeout(u,e),r(j)}return void 0===g&&(g=setTimeout(u,e)),y}var b,v,m,y,g,j,d=0,p=!1,O=!1,T=!0;if("function"!=typeof t)throw new TypeError(FUNC_ERROR_TEXT);return e=toNumber(e)||0,isObject(n)&&(p=!!n.leading,O="maxWait"in n,m=O?nativeMax(toNumber(n.maxWait)||0,e):m,T="trailing"in n?!!n.trailing:T),s.cancel=c,s.flush=l,s} | |
function throttle(t,e,n){var r=!0,o=!0;if("function"!=typeof t)throw new TypeError(FUNC_ERROR_TEXT);return isObject(n)&&(r="leading"in n?!!n.leading:r,o="trailing"in n?!!n.trailing:o),debounce(t,e,{leading:r,maxWait:e,trailing:o})}function isObject(t){var e=typeof t;return!!t&&("object"==e||"function"==e)}function isObjectLike(t){return!!t&&"object"==typeof t}function isSymbol(t){return"symbol"==typeof t||isObjectLike(t)&&objectToString.call(t)==symbolTag}function toNumber(t){if("number"==typeof t)return t;if(isSymbol(t))return NAN;if(isObject(t)){var e="function"==typeof t.valueOf?t.valueOf():t;t=isObject(e)?e+"":e}if("string"!=typeof t)return 0===t?t:+t;t=t.replace(reTrim,"");var n=reIsBinary.test(t);return n||reIsOctal.test(t)?freeParseInt(t.slice(2),n?2:8):reIsBadHex.test(t)?NAN:+t}var FUNC_ERROR_TEXT="Expected a function",NAN=NaN,symbolTag="[object Symbol]",reTrim=/^\s+|\s+$/g,reIsBadHex=/^[-+]0x[0-9a-f]+$/i,reIsBinary=/^0b[01]+$/i,reIsOctal=/^0o[0-7]+$/i,freeParseInt=parseInt,freeGlobal="object"==typeof global&&global&&global.Object===Object&&global,freeSelf="object"==typeof self&&self&&self.Object===Object&&self,root=freeGlobal||freeSelf||Function("return this")(),objectProto=Object.prototype,objectToString=objectProto.toString,nativeMax=Math.max,nativeMin=Math.min,now=function(){return root.Date.now()}; | |
window.addEventListener( 'load', stickyTabbarToggle() ); | |
window.addEventListener( 'resize', stickyTabbarToggle() ); | |
window.addEventListener( 'scroll', throttle(stickyTabbarToggle, 50, { leading: true, trailing: true } )); | |
} )( jQuery, this ); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment