Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

mouse-around

Package Overview
Dependencies
Maintainers
1
Versions
6
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

mouse-around

mouse hover event for elements

  • 1.1.0
  • latest
  • npm
  • Socket score

Version published
Weekly downloads
0
decreased by-100%
Maintainers
1
Weekly downloads
 
Created
Source

A single event for mouse on, mouse around & mouse out. Can be used on whole elements, or for distinct points within any element. The latter feature was added specifically for canvas nodes.

var hover = require('mouse-around')

hover(el, [points], callback)

callback will be fired when mouse hovers the element. if an array of point-circles is included, the callback will only fire when hovering that areat that offset within the element. See below for example points array.

install

npm install mouse-around

example

  var mouseAround = require('mouse-around');

  // the node u want to trigger on
	var node = document.getElementById('someElement');
  
  // optionally, an array of point-circle objects
  var points = [(x: 100, y: 100, radius: 25}/*,{...}*/]
	
  var hoverBot = document.getElementById('hoverbot');
	
	mouseAround(node, callback, points); // otionally include an array of point-circle objects 
	
	// evt = the mouse event
	// node = the original node you were listening to
	// position = the absolute position of the element currently being hovered (which may be a child element)
	// start & stop = boolean
	
	function callback(evt, node, position, start, end){
		hoverBot.style.left = 50 + evt.clientX + "px";
		hoverBot.style.top = evt.clientY - 25 + 'px';
		if(end) hoverBot.style.left = '-1000px'; 
	};
	

LICENSE: MIT

Keywords

FAQs

Package last updated on 04 May 2015

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc