📡 You're offline — showing cached content
⚡ New version available!
Quick Access
🗺️ Roadmaps 🃏 Flashcards 📚 Series 🎓 Tutorials 🗺️ My Path 🎤 Mock Interview ⚡ Cheat Code 📄 Resume Builder 🛠️ Dev Tools
Tutorials › jQuery in Practice › Mouse Events

Mouse Events

4 min read
mouseenter and mouseleave are the best hover events — they do not fire on child elements. hover(fnIn, fnOut) is a convenient shortcut for both. Use e.pageX and e.pageY to track cursor position for tooltips.

Mouse Events

$('#btn').on('mouseenter', fn);
$('#btn').on('mouseleave', fn);
$('#btn').hover(fnIn, fnOut); // shorthand
$('#box').on('dblclick', fn);
$('#box').on('contextmenu', function(e) {
  e.preventDefault();
  showMenu(e.pageX, e.pageY);
});