Mouse Events in jQuery

Mouse Events in jQuery — a practical guide to jQuery mouse events with clear examples you can reuse in real projects.

jQuery Tutorial Series (20/101). Prefer one article? Read the complete jQuery tutorial.

Short description

mouseenter/leave do not bubble like mouseover/out — often clearer for UI.

Mouse events

$('.card').on('mouseenter', function () {
  $(this).addClass('hover');
}).on('mouseleave', function () {
  $(this).removeClass('hover');
});