简介
move.js 是一个轻量级的 JavaScript 库，用于为 HTML 元素添加动画效果。它具有简单易用、可扩展性强等优点，适合前端开发人员在网站和 Web 应用程序中使用。
安装
使用 npm 安装 move.js：
npm install move-js
使用
基本用法
假设我们想要将一个元素从左侧移动到右侧，并在 2 秒内完成这个操作，可以使用以下代码：
const elem = document.getElementById("myElement"); move(elem).x(500).duration("2s").end();
上述代码中，我们首先获取了 ID 为 "myElement" 的元素，然后使用 move() 方法创建一个 MoveObject 对象，并通过调用 x() 方法指定了元素的水平位置变化量为 500。接着使用 duration() 方法设置动画持续时间为 2 秒。最后，通过调用 end() 方法启动动画。
高级用法
除了基本的动画效果，move.js 还支持更多高级用法，例如缓动（easing）、队列（queueing）和回调函数等。
-- -------------------- ---- ------- ----- ---- - ------------------------------------- ---------- --------------- ------- ------- --------------- --------------------- - ------------------ --------- ------------ ------- -- --------- ------------ --------------------- - ------------------- --------- ------------ ------- -- --------------- - ---------------- ---------- ------------ ---展开代码
上述代码中，我们首先创建了一个 MoveObject 对象，并使用 ease() 方法指定了缓动类型为 "in-out"。然后，我们按顺序调用了一些方法，这些方法将元素移动、缩放和旋转。在这些方法之间，我们使用 queue() 方法添加了两个回调函数，它们分别在每个动画结束时被触发。最后，我们在 end() 方法中指定了一个最终的回调函数，当所有动画结束时被触发。
指导意义
move.js 是一个非常有用的 JavaScript 库，可以帮助前端开发人员轻松地为网站和 Web 应用程序添加动画效果。通过掌握 move.js 的基本用法和高级功能，开发人员可以创建出更加丰富和生动的用户界面，并提升用户体验。
示例代码
-- -------------------- ---- ------- --------- ----- ------ ------ -------------- ---------- ------- ------------------------------------------------ ------ ---------------- ---------- - ------ ----- ------- ----- ----------------- ---- --------- --------- ---- ------ ----- ------ - -------- ------- ------ ---- --------------------- ------- ----------------------- ----- ---- - ------------------------------------- --------------------------------------- --------- ------- -------展开代码
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/33542
