简介
marquee-ora是一个高度可自定义的Marquee/Scroller包，具有多种滚动方向，速度和动画样式。此教程将为你提供 marquee-ora 的详细使用方法。
安装 marquee-ora
在终端中输入下面的命令，安装 marquee-ora 套件：
npm install marquee-ora
使用 marquee-ora
要使用 marquee-ora，你得先导入 marquee-ora 模块。
const Marquee = require('marquee-ora');然后，需要创建一个容器以容纳滚动内容，选择一个合适的滚动方向，然后使用 marquee-ora 的实例对象来执行实际的滚动。下面是一个完整的示例代码：
-- -------------------- ---- -------
------
------
-------------- ---------------
-------
------------------ -
------ ------
------- ------
--------- -------
----------------- ----------
-
--------
-------
------
---- --------------------------
--- ---------------
---------- -----------
----------- -- ----------------
-------- - ---- ---------
-----
------
--------
----- ------- - -----------------------
----- --------- - --- -------------------- -
----- -----
---------- -------
--------- -----
----------------- -----
------------- -----
--------------- -------------------------------------
---
------------------
---------
-------
-------marquee-ora Options
marquee-ora 提供了许多选项以控制滚动的行为。下面是这些选项的详细说明：
loop: 设置是否循环滚动。默认值为true。direction: 设置滚动方向。可以是"up","down","right"或"left"。默认值为"left"。duration: 设置滚动持续时间，以毫秒为单位。默认值为5000。delayBeforeStart: 设置在开始滚动前的延迟，以毫秒为单位。默认值为0。pauseOnHover: 设置当鼠标悬停在滚动区域上方时是否暂停滚动。默认值为false。easingFunction: 设置动画函数。默认值为Marquee.EasingFunctions.linear。
可用的滚动效果
在 marquee-ora 中，你可以使用不同的滚动效果。这些滚动效果基于 CSS3 transition 实现，所以它们在支持 CSS3 的现代浏览器中表现良好，但在旧版浏览器中可能会出现问题。
下面是 marquee-ora 中可用的滚动效果：
slide: 滑动效果，每个项目似乎相互挤压。scroll: 所有元素占用相同的空间，用遥感更改停止位置。scroll3d: 拉近、滚动和拉远的效果。slide3d: 假装有需要从一个角落飞出的元素，并在结束位置上升。
-- -------------------- ---- ------- ----- --------- - --- -------------------- - ---------- ------- --------------- -------------------------------------- ---------- ---------- ------------------ ----- ----- ----- ----------------- ---- --- ------------------
指导意义
了解 marquee-ora 可以使你的网站更加丰富多彩，实现更多有趣的滚动效果。此外，了解 marquee-ora 的使用方法，也可以给你在应用其他 NPM 包时提供借鉴和启发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6006735b890c4f7277583f90