jQuery UI API - Mouse Interaction

Category

Interactions | Utilities

Usage

Description:Basic interaction layer.

Dependencies:

Notes:andjQuery.WidgetSimilarly, Mouse Interaction is not intended for direct use. This is a base layer purely for other widgets to inherit. This page has additions to thejQuery.Widgetdocumentation, but it contains internal methods that cannot be overridden. The public API is_mouseStart()、_mouseDrag()、_mouseStop()and_mouseCapture()。

Quick navigation

Options Methods Events

Options Type Description Default
cancel Selector Prevents interactions from starting on specified elements.

Code example:

Initialize with the specifiedcanceloptions for the mouse:

$( ".selector" ).mouse({ cancel: ".title" });
    

After initialization, get or set thecanceloption:

// getter
var cancel = $( ".selector" ).mouse( "option", "cancel" );
 
// setter
$( ".selector" ).mouse( "option", "cancel", ".title" );
    
 "input, textarea, button, select, option"
delay Number The time in milliseconds after mouse down until the interaction starts. This option can be used to prevent unwanted interactions when clicking on an element.

Code example:

Initialize with the specifieddelayoptions for the mouse:

$( ".selector" ).mouse({ delay: 300 });
    

After initialization, get or set thedelayoption:

// getter
var delay = $( ".selector" ).mouse( "option", "delay" );
 
// setter
$( ".selector" ).mouse( "option", "delay", 300 );
    
 0
distance Number The distance in pixels the mouse must move after mouse down and before the interaction starts. This option can be used to prevent unwanted interactions when clicking on an element.

Code example:

Initialize with the specifieddistanceoptions for the mouse:

$( ".selector" ).mouse({ distance: 10 });
    

After initialization, get or set thedistanceoption:

// getter
var distance = $( ".selector" ).mouse( "option", "distance" );
 
// setter
$( ".selector" ).mouse( "option", "distance", 10 );
    
 1

Methods Returns Description
_mouseCapture() Boolean Determines whether the interaction should start based on the event target of the interaction. The default implementation always returnstrue。
  • This method does not accept any arguments.

Code example:

Invoke the _mouseCapture method:

$( ".selector" ).mouse( "_mouseCapture" );
    
_mouseDelayMet() Boolean Determinesdelaywhether the option is met for the current interaction.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseDelayMet method:

$( ".selector" ).mouse( "_mouseDelayMet" );
    
_mouseDestroy() jQuery (plugin only) Destroys the interaction event handlers. This must be called from the extending widget's_destroy()method.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseDestroy method:

$( ".selector" ).mouse( "_mouseDestroy" );
    
_mouseDistanceMet() Boolean Determinesdistancewhether the option is met for the current interaction.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseDistanceMet method:

$( ".selector" ).mouse( "_mouseDistanceMet" );
    
_mouseDown() jQuery (plugin only) Handles the start of the interaction. Confirms that the event is associated with the primary mouse button and ensures thatdelayanddistanceis satisfied before the interaction starts. When the interaction is ready to start, it calls the extending widget's_mouseStartmethod.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseDown method:

$( ".selector" ).mouse( "_mouseDown" );
    
_mouseDrag() jQuery (plugin only) The extending widget should implement a_mouseDrag()method to handle each move of the interaction. This method receives the mouse event associated with the mouse movement.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseDrag method:

$( ".selector" ).mouse( "_mouseDrag" );
    
_mouseInit() jQuery (plugin only) Initializes the interaction event handlers. This must be called from the extending widget's_create()method.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseInit method:

$( ".selector" ).mouse( "_mouseInit" );
    
_mouseMove() jQuery (plugin only) Handles each move of the interaction. Calls the extending widget's_mouseDragmethod.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseMove method:

$( ".selector" ).mouse( "_mouseMove" );
    
_mouseStart() jQuery (plugin only) The extending widget should implement a_mouseStart()method to handle the start of the interaction. This method receives the mouse event associated with the start of the interaction.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseStart method:

$( ".selector" ).mouse( "_mouseStart" );
    
_mouseStop() jQuery (plugin only) The extending widget should implement a_mouseStop()method to handle the end of the interaction. This method receives the mouse event associated with the end of the interaction.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseStop method:

$( ".selector" ).mouse( "_mouseStop" );
    
_mouseUp() jQuery (plugin only) Handles the end of the interaction. Calls the extending widget's handler_mouseStopmethod.
  • This method does not accept any arguments.

Code example:

Invoke the _mouseUp method:

$( ".selector" ).mouse( "_mouseUp" );
Other extensions