About Event mouseover, mouseout, mouseenter,mouseleave differences _javascript skills

Recently in the online exam and course shopping mall have encountered such a problem: that is, when the mouse is sliding over a layer, when the mouse slide to the current layer words mouseover and mouseout in the lower version of the browser will appear flashing phenomenon, the solution to this phenomenon are many, But I think one of the simplest is to replace mouseover and mouseout with the corresponding MouseEnter and MouseLeave.

The MouseOver event occurs when the mouse pointer is over the element.

This event is most often used in conjunction with the Mouseout event.

Note: Unlike the MouseEnter event, the MouseOver event is triggered regardless of whether the mouse pointer crosses the selected element or its child elements. The MouseEnter event is triggered only when the mouse pointer crosses the selected element.

Note: Unlike the MouseLeave event, the Mouseout event is triggered regardless of whether the mouse pointer leaves the selected element or any child elements. The MouseLeave event is triggered only when the mouse pointer leaves the selected element. Take a look at the demo in the example below.

The MouseEnter event occurs when the mouse pointer crosses an element. This event is most often used in conjunction with the MouseLeave event.

Note: mouseover, mouseout also triggers an event when the mouse pointer crosses a child element of the selected element. This is sometimes an unexpected bug when binding an event that may be caused by the MouseOver mouseout event

MouseOver and MouseEnter

The MouseOver event is triggered regardless of whether the mouse pointer crosses the selected element or its child elements.

The MouseEnter event is triggered only when the mouse pointer crosses the selected element.

Mouseout and MouseLeave

The Mouseout event is triggered regardless of whether the mouse pointer leaves the selected element or any child elements.

The MouseLeave event is triggered only when the mouse pointer leaves the selected element.