最小值最大值

在可用的最小或最大可滚动空间中定义阈值。这在某些目标元素的初始位置太小或太大而无法触发 enter 和 leave 条件的情况下尤其有用。

接受

值	描述
`'min'`	满足进入或离开条件的最小值
`'max'`	满足进入或离开条件的最大值

最小值最大值代码示例

import { animate, onScroll, utils } from 'animejs';

utils.$('.square').forEach($square => {
  animate($square, {
    x: '15rem',
    rotate: '1turn',
    duration: 2000,
    alternate: true,
    ease: 'inOutQuad',
    autoplay: onScroll({
      container: '.scroll-container',
      sync: 1,
      enter: 'max bottom',
      leave: 'min top',
      debug: true
    })
  });
});

<div class="scroll-container scroll-y">
  <div class="scroll-content grid square-grid">
    <div class="scroll-section padded">
      <div class="large row">
        <div class="square"></div>
      </div>
    </div>
    <div class="scroll-section padded">
      <div class="large row">
        <div class="square"></div>
      </div>
    </div>
    <div class="scroll-section padded">
      <div class="large row">
        <div class="square"></div>
      </div>
    </div>
  </div>
</div>

上一个 下一个

最小值 最大值

接受

最小值最大值