jQuery Plugin To Detect Mouse Enter/Exit Events By Side - jq.entry

File Size: 5.23 KB
Views Total: 5133
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Detect Mouse Enter/Exit Events By Side - jq.entry

jq.entry is a simple yet useful jQuery plugin which detects from which side the mouse entered and exited a specific element. Useful to create direction-aware hover effects on your DOM elements.

Basic usage:

1. Download the plugin and include the JavaScript file jq.entry.js after jQuery library.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jq.entry.js"></script>

2. The sample JavaScript to determine from which side of a specific element the mouse cursor came from.

$('#elem').hover(function( event ){

  var direction = $(this).entry({ e : event });
  console.log( 'Enter direction: ' + direction );

}, function( event ){

  var direction = $(this).entry({ e : event });
  console.log( 'Leave direction: ' + direction );

});

3. Plugin's default settings.

// Inverts direction
invert: false,

// Namespace
namespace: 'entry',

// Name of border directions
sides: ['up', 'right', 'down', 'left']

This awesome jQuery plugin is developed by NeXTs. For more Advanced Usages, please check the demo page or visit the official website.