anime.js logo v4 Anime.js | JavaScript Animation Engine

  • 文档
  • 缓动
  • Nodejs.cn
  • 入门
    • 安装
    • 模块导入
    • 与原生 JS 一起使用
    • 与 React 一起使用
  • 定时器
    • 播放设置
      • delay
      • duration
      • loop
      • loopDelay
      • alternate
      • reversed
      • autoplay
      • frameRate
      • playbackRate
    • 回调
      • onBegin
      • onComplete
      • onUpdate
      • onLoop
      • onPause
      • then()
    • 方法
      • play()
      • reverse()
      • pause()
      • restart()
      • alternate()
      • resume()
      • complete()
      • reset()
      • cancel()
      • revert()
      • seek()
      • stretch()
    • 属性
  • 动画
    • 目标
      • CSS 选择器
      • DOM元素
      • JavaScript 对象JS
      • 目标数组
    • 可动画属性
      • CSS 属性
      • CSS 转换
      • CSS 变量JS
      • JS 对象属性JS
      • HTML 属性JS
      • SVG 属性JS
    • 补间值类型
      • 数字的
      • 单位转换
      • 相对JS
      • 颜色
      • 颜色功能WAAPI
      • CSS 变量
      • 基于功能
    • 补间参数
      • to
      • from
      • delay
      • duration
      • ease
      • compositionJS
      • modifierJS
    • 关键帧
      • 补间数值
      • 补间参数JS
      • 基于持续时间JS
      • 基于百分比JS
    • 播放设置
      • delay
      • duration
      • loop
      • loopDelayJS
      • alternate
      • reversed
      • autoplay
      • frameRateJS
      • playbackRate
      • playbackEaseJS
      • persistWAAPI
    • 回调
      • onBeginJS
      • onComplete
      • onBeforeUpdateJS
      • onUpdateJS
      • onRenderJS
      • onLoopJS
      • onPauseJS
      • then()
    • 方法
      • play()
      • reverse()
      • pause()
      • restart()
      • alternate()
      • resume()
      • complete()
      • cancel()
      • revert()
      • reset()JS
      • seek()
      • stretch()JS
      • refresh()JS
    • 属性
  • 时间线
    • 添加计时器
    • 添加动画
    • 同步 WAAPI 动画
    • 同步时间线
    • 调用函数
    • 时间位置
    • 播放设置
      • defaults
      • delay
      • loop
      • loopDelay
      • alternate
      • reversed
      • autoplay
      • frameRate
      • playbackRate
      • playbackEase
    • 回调
      • onBegin
      • onComplete
      • onBeforeUpdate
      • onUpdate
      • onRender
      • onLoop
      • onPause
      • then()
    • 方法
      • add()
      • set()
      • sync()
      • label()
      • remove()
      • call()
      • init()
      • play()
      • reset()
      • reverse()
      • pause()
      • restart()
      • alternate()
      • resume()
      • complete()
      • cancel()
      • revert()
      • seek()
      • stretch()
      • refresh()
    • 属性
  • 可动画化
    • 设置
      • unit
      • duration
      • ease
      • modifier
    • 方法
      • 取值器
      • 设置器
      • revert()
    • 属性
  • 可拖动
    • 坐标轴参数
      • x
      • y
      • snap
      • modifier
      • mapTo
    • 设置
      • trigger
      • container
      • containerPadding
      • containerFriction
      • releaseContainerFriction
      • releaseMass
      • releaseStiffness
      • releaseDamping
      • velocityMultiplier
      • minVelocity
      • maxVelocity
      • releaseEase
      • dragSpeed
      • dragThreshold
      • scrollThreshold
      • scrollSpeed
      • cursor
    • 回调
      • onGrab
      • onDrag
      • onUpdate
      • onRelease
      • onSnap
      • onSettle
      • onResize
      • onAfterResize
    • 方法
      • disable()
      • enable()
      • setX()
      • setY()
      • animateInView()
      • scrollInView()
      • stop()
      • reset()
      • revert()
      • refresh()
    • 属性
  • 布局NEW
    • 使用
      • 指定根目录
      • CSS显示动画
      • 错列布局
      • DOM顺序动画
      • 进入布局动画
      • 退出布局动画
      • 交换父动画
      • 模态对话框动画
    • 设置
      • children
      • delay
      • duration
      • ease
      • properties
    • 状态
      • enterFrom
      • leaveTo
      • swapAt
    • 方法
      • record()
      • animate()
      • update()
      • revert()
    • 布局ID
    • 回调
    • 属性
    • 常见问题
  • 范围
    • 添加构造函数
    • 注册方法函数
    • 参数
      • root
      • defaults
      • mediaQueries
    • 方法
      • add()
      • addOnce()
      • keepTime()
      • revert()
      • refresh()
    • 属性
  • 事件
    • onScroll
      • 设置
        • container
        • target
        • debug
        • axis
        • repeat
      • 阈值
        • 数值
        • 位置缩写
        • 相对位置值
        • 最小值 最大值
      • 同步模式
        • 方法名称
        • 播放进度
        • 平滑滚动
        • 缓动滚动
      • 回调
        • onEnter
        • onEnterForward
        • onEnterBackward
        • onLeave
        • onLeaveForward
        • onLeaveBackward
        • onUpdate
        • onSyncComplete
        • onResize
      • 方法
        • link()
        • refresh()
        • revert()
      • 属性
  • SVG
    • morphTo
    • createDrawable
    • createMotionPath
  • 文本
    • splitText
      • 设置
        • lines
        • words
        • chars
        • debug
        • includeSpaces
        • accessible
      • 拆分参数
        • class
        • wrap
        • clone
      • HTML 模板
      • 方法
        • addEffect()
        • revert()
        • refresh()
      • 属性
  • 实用工具
    • stagger()
      • 时间错开
      • 数值惊人
      • 时间线错开
      • 值类型
        • 数字的
        • 范围
      • 参数
        • start
        • from
        • reversed
        • ease
        • grid
        • axis
        • modifier
        • use
        • total
    • $()
    • get()
    • set()
    • cleanInlineStyles()
    • remove()
    • sync()
    • keepTime()
    • random()
    • createSeededRandom()
    • randomPick()
    • shuffle()
    • round()
    • clamp()
    • snap()
    • wrap()
    • mapRange()
    • lerp()
    • damp()
    • roundPad()
    • padStart()
    • padEnd()
    • degToRad()
    • radToDeg()
    • 可链式使用的工具
  • 缓动
    • 内置缓动
    • 立方贝塞尔
    • 线性
    • 步进
    • 不规则
    • 弹簧
  • WAAPI
    • 何时使用
    • 硬件加速
    • WAAPI 的改进
      • 合理的默认设置
      • 多目标动画
      • 默认单位
      • 基于函数的值
      • 个体转变
      • 单个属性参数
      • 弹簧和自定义缓动
    • API 差异
      • iterations
      • direction
      • easing
      • finished
    • convertEase()
  • 引擎
    • 参数
      • timeUnit
      • speed
      • fps
      • precision
      • pauseOnDocumentHidden
    • 方法
      • update()
      • pause()
      • resume()
    • 属性
    • 引擎默认设置

范围

自 4.0.0 起

作用域方法

createScope() 函数返回的 Scope 实例上可用的方法。

const scope = createScope(parameters);
      ┌──────────┐
scope.│add()     │
scope.│refresh() ├─ Methods
scope.│revert()  │
      └──────────┘
在本节
  • add()
  • addOnce()
  • keepTime()
  • revert()
  • refresh()
上一页 下一页
  • mediaQueries
  • add()
Anime.js 中文网 - 粤ICP备13048890号 - Nodejs.cn 旗下网站