吸附

将双轴或单轴的最终值四舍五入到最近的指定增量。
如果提供一个 Array 作为增量，则从数组中选择最接近的值。

接受

数字
Array<Number>
一个 Function，返回上述任意值

当使用 Function 定义时，每当容器或目标元素尺寸改变时，该值将自动刷新。
它也可以通过使用 refresh() 方法手动刷新。

默认值

0

snap 代码示例

import { createDraggable } from 'animejs';

createDraggable('.square', {
  container: '.grid',
  snap: 56, // Global to both x and y
  x: { snap: [0, 200] }, // Specific to x 
});

<div class="large grid square-grid">
  <div class="square draggable"></div>
</div>

#draggable-draggable-axes-parameters-snap .demo {
  width: 300px;
}

#draggable-draggable-axes-parameters-snap .grid::after {
  background-size: 100px 56px;
}

#draggable-draggable-axes-parameters-snap .grid::before {
  content: "";
  display: block;
  position: absolute;
  top: 1px;
  left: 100px;
  width: 100px;
  height: calc(100% - 1px);
  background-image: repeating-linear-gradient(
    45deg,
    currentColor 0,
    currentColor 1px,
    transparent 1px,
    transparent 6px
  );
  background-size: 8px 8px;
}

#draggable-draggable-axes-parameters-snap .square {
  width: 100px;
  height: 56px;
}

y
修饰符