简介
mg-bitneon 是一个快速创建霓虹发光效果文字的 npm 包，包含了多种可配置参数，可轻松创建出复杂的动态效果。本文将介绍如何使用该 npm 包来创建霓虹发光效果文字。
安装
npm install mg-bitneon
使用方法
基本用法
const mgbitneon = require('mg-bitneon');
mgbitneon('Hello World', {
color: 'white',
effect: 'neon',
speed: 60,
glow: 0.1
});以上代码将创建霓虹发光效果的 Hello World 文字，颜色为白色，效果为霓虹，速度为 60，阴影强度为 0.1。
参数说明
mgbitneon(text, options)
text(string): 要创建效果的文字。options(object): 可配置参数。
以下是可配置参数的详细说明：
| 参数 | 类型 | 默认值 | 说明 |
|---|---|---|---|
color |
string | "white" |
文字颜色。 |
effect |
string | "neon" |
发光效果。可选值有 "neon", "fire", "plasma" 和 "cloud"。 |
speed |
number | 60 |
效果速度。 |
glow |
number | 0.1 |
阴影强度。 |
padding |
number | 20 |
文字的内边距。 |
以下是效果值所对应的展示效果：
| 效果 | 效果展示 |
|---|---|
"neon" |
 |
"fire" |
|
"plasma" |
|
"cloud" |
|
示例
以下是一个使用 mg-bitneon 创建动态文字效果的示例：
-- -------------------- ---- -------
--------- -----
------
------
----------------- ------------
------- --------------------------------------------
-------
---- -
----------------- ------
-------- -----
---------------- -------
------------ -------
------- ------
------- --
-
--------
-------
------
--- ---------------- ----------
--------
----- ----- - ---------------------------------
----- ------- - -
------ --------
------- -------
------ ---
----- ----
-------- ---
--
-------------- -- -
----- ------- - -------------------- ----
-- --------- -
--------------- - --------
-------------------------- ---------
-
-- ------
-------------------------- ---------
---------
-------
-------以上示例展示了一个文字不断变换的效果，并且同时提供了用户输入自定义文本的功能。
总结
mg-bitneon 包非常适合用在需要添加动态霓虹发光效果的网站和应用中。使用它能够轻松创建出复杂的动态效果，让页面更加生动有趣。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f441d8e776d08040e94