## Mouse Interaction

Description: The base interaction layer.

## QuickNav

Similar to `jQuery.Widget`, the mouse interaction is not intended to be used directly. It is purely a base layer for other widgets to inherit from. This page only documents what is added to `jQuery.Widget`, but it does include internal methods that are not intended to be overwritten. The intended public API is `_mouseStart()`, `_mouseDrag()`, `_mouseStop()`, and `_mouseCapture()`.

### Dependencies

- Widget Factory

## Options

### cancelType: Selector

Default: `"input,textarea,button,select,option"`
Prevents interactions from starting on specified elements.
Code examples:

Initialize the mouse with the `cancel` option specified:

1

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

Get or set the `cancel` option, after initialization:

1
2
3
4
5

    // gettervar cancel = $( ".selector" ).mouse( "option", "cancel" ); // setter$( ".selector" ).mouse( "option", "cancel", ".title" );

### delayType: Number

Default: `0`
Time in milliseconds after mousedown until the interaction should start. This option can be used to prevent unwanted interactions when clicking on an element.
Code examples:

Initialize the mouse with the `delay` option specified:

1

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

Get or set the `delay` option, after initialization:

1
2
3
4
5

    // gettervar delay = $( ".selector" ).mouse( "option", "delay" ); // setter$( ".selector" ).mouse( "option", "delay", 300 );

### distanceType: Number

Default: `1`
Distance in pixels after mousedown the mouse must move before the interaction should start. This option can be used to prevent unwanted interactions when clicking on an element.
Code examples:

Initialize the mouse with the `distance` option specified:

1

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

Get or set the `distance` option, after initialization:

1
2
3
4
5

    // gettervar distance = $( ".selector" ).mouse( "option", "distance" ); // setter$( ".selector" ).mouse( "option", "distance", 10 );

## Methods

### _mouseCapture()Returns: Boolean

Determines whether an interaction should start based on event target of the interaction. The default implementation always returns `true`.

- This method does not accept any arguments.

Code examples:

Invoke the _mouseCapture method:

1

    $( ".selector" ).mouse( "_mouseCapture" );

### _mouseDelayMet()Returns: Boolean

Determines whether the `delay` option has been met for the current interaction.

- This method does not accept any arguments.

Code examples:

Invoke the _mouseDelayMet method:

1

    $( ".selector" ).mouse( "_mouseDelayMet" );

### _mouseDestroy()Returns: 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 examples:

Invoke the _mouseDestroy method:

1

    $( ".selector" ).mouse( "_mouseDestroy" );

### _mouseDistanceMet()Returns: Boolean

Determines whether the `distance` option has been met for the current interaction.

- This method does not accept any arguments.

Code examples:

Invoke the _mouseDistanceMet method:

1

    $( ".selector" ).mouse( "_mouseDistanceMet" );

### _mouseDown()Returns: jQuery (plugin only)

Handles the beginning of an interaction. Verifies that the event is associated with the primary mouse button and ensures that the `delay` and `distance` options are met prior to starting the interaction. When the interaction is ready to start, invokes the `_mouseStart()` method for the extending widget to handle.

- This method does not accept any arguments.

Code examples:

Invoke the _mouseDown method:

1

    $( ".selector" ).mouse( "_mouseDown" );

### _mouseDrag()Returns: jQuery (plugin only)

The extending widget should implement a `_mouseDrag()` method to handle each movement of an interaction. This method will receive the mouse event associated with the movement.

- This method does not accept any arguments.

Code examples:

Invoke the _mouseDrag method:

1

    $( ".selector" ).mouse( "_mouseDrag" );

### _mouseInit()Returns: 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 examples:

Invoke the _mouseInit method:

1

    $( ".selector" ).mouse( "_mouseInit" );

### _mouseMove()Returns: jQuery (plugin only)

Handles each movement of the interaction. Invokes the `mouseDrag()` method for the extending widget to handle.

- This method does not accept any arguments.

Code examples:

Invoke the _mouseMove method:

1

    $( ".selector" ).mouse( "_mouseMove" );

### _mouseStart()Returns: jQuery (plugin only)

The extending widget should implement a `_mouseStart()` method to handle the beginning of an interaction. This method will receive the mouse event associated with the start of the interaction.

- This method does not accept any arguments.

Code examples:

Invoke the _mouseStart method:

1

    $( ".selector" ).mouse( "_mouseStart" );

### _mouseStop()Returns: jQuery (plugin only)

The extending widget should implement a `_mouseStop()` method to handle the end of an interaction. This method will receive the mouse event associated with the end of the interaction.

- This method does not accept any arguments.

Code examples:

Invoke the _mouseStop method:

1

    $( ".selector" ).mouse( "_mouseStop" );

### _mouseUp()Returns: jQuery (plugin only)

Handles the end of the interaction. Invokes the `mouseStop()` method for the extending widget to handle.

- This method does not accept any arguments.

Code examples:

Invoke the _mouseUp method:

1

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