请马上登录，朋友们都在花潮里等着你哦：）
您需要 登录 才可以下载或查看，没有账号？立即注册
x
lzRing() 指令的名称暗示着它的含义：lz，粒子，Ring，圆环，合起来意为粒子绕成一个圆环。指令需要三个参数：
① num，粒子数量
② pa，粒子的父元素
③ { option }，粒子的具体配置
下面是 lzRing() 指令语法结构，其中的粒子配置罗列的键值对是指令能够识别的 ——
tz.lzRing(num, pa, {
width: 40, // 粒子宽度（缺省20）
height: 40, // 粒子高度（缺省20）
background: 'pink', // 粒子背景色（缺省随机）
tag: tag, // 粒子所使用的标签名（缺省div）
className: 'circle' // 粒子的class属性名，指向 .class CSS选择器，缺省形状为矩形
});
给个可以在线预览的实例：先创建一个装载粒子的容器，其id="mum"（临时定义），class="wrap300"（使用配套CSS文档的提供的class选择器）；粒子的配置只有宽高与类名，后者使用的是CSS文档自带的 .circle 选择器，其余不配置的使用模块默认值。
<style>
@import 'https://638183.freep.cn/638183/web/tz/tz.e.css';
.pa { --bg: linear-gradient(plum, black, tan); }
</style>
<div class="pa"></div>
<script type="module">
import TZ from 'https://638183.freep.cn/638183/web/tz/tz.e.js';
const tz = TZ.TZ('pa');
tz.add('div', 'mum', 'wrap300', {style: 'border: 1px solid gray'});
tz.lzRing(15, 'mum', {
width: 40,
height: 40,
className: 'circle'
});
</script>
粒子的更多修饰可通过CSS代码的同名选择器 .circle {...} 进一步扩充，指令不提供其它配置参数外的配置入口。
| 
发表于 2025-10-23 08:02
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡
楼主
