dragThreshold
Specifies the distance in pixels needed to trigger a drag.
The threshold can be specified differently for mouse our touch devices by using an object.
dragThreshold: 3,
// Or
dragThreshold: { mouse: 3, touch: 7 },
Accepts
Number
{ mouse: Number, touch: Number }
- A
Function
that returns aNumber
or{ mouse: Number, touch: Number }
When defined using a Function
, the value will be automatically refreshed every time the container or target element is resized.
It can also be refreshed manually using the refresh()
method.
Default
{ mouse: 3, touch: 7 }
dragThreshold code example
import { createDraggable } from 'animejs';
createDraggable('.square', {
container: '.grid',
dragThreshold: 20,
});
createDraggable('.circle', {
container: '.grid',
dragThreshold: { mouse: 10, touch: 15 },
});
<div class="large centered grid square-grid">
<div class="square draggable"></div>
<div class="circle draggable"></div>
</div>