Code has been added to clipboard!

jQuery relatedTarget: Track the Movements In or Out of Elements

Reading time 1 min
Published Jan 2, 2018
Updated Sep 25, 2019

jQuery relatedTarget: Main Tips

  • The event.relatedTarget property tracks cursor movements to determine when an element is being entered or exited.
  • This property is related to jQuery mouse events.
  • The jQuery relatedTarget property returns the element being entered/exited as the cursor moves.

Usage of event.relatedTarget

By tracking the cursor movements across a page, the event.relatedTarget property specifies which element is entered or exited. The results depend on whether it is a mouseover (exiting element) or a mouseout (entering element) event.

Example
$("div, p").mouseenter((event) => {
   $("#message").html("Related target is: " + event.relatedTarget.nodeName);
});

The example above reveals the usage of event.relatedTarget. Moving your cursor around and causing jQuery mouse events, you will see that the related target will be indicated.

Latest Udacity Coupon Found:

Verified STAFF PICK

75% OFF COURSES

Udacity Black Friday Offer

The best time to save on Udacity courses is now - follow this coupon to access a 75% Udacity Black Friday discount & enjoy learning at a very low cost!

Expiration date: 28/01/2021
3176 People Used
Only 97 Left
Rating
5.0