<h1>Resize the window and view the developer tools console</h1>
// delay function to use on resize to prevent multiple resize events
var delay = (function () {
var timer = 0;
return function (callback, ms) {
clearTimeout(timer);
timer = setTimeout(callback, ms);
};
})();
// Add the delayed functions here
const delayedFunctions = function () {
console.log('delayedFunctions running');
}
// document ready
$( document ).ready(function() {
// delayedFunctions on load
delayedFunctions();
});
// window resize
window.onresize = function(event) {
delay(function(){
console.log('Window Resize WITH DELAY :)');
delayedFunctions();
}, 500);
};
$(window).on('resize', function(){
console.log('Window Resize NO DELAY :(');
});
This Pen doesn't use any external CSS resources.