Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
How to delay a JavaScript event within an event listener
function myDelayedThing() {
var mySelectors = document.querySelectorAll('.something');
// Loop through mySelectors
for(var i = 0; i < menuLinks.length; i++) {
// Add 'open' class on mouseover
menuLinks[i].addEventListener('mouseover', function() {
this.classList.add('open');
});
// Remove 'open" class with a delay
menuLinks[i].addEventListener('mouseout', function () {
var node = this; // Allows us to access 'this' within the timeout function
setTimeout(function() {
node.classList.remove('open');
}, 500)
});
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment