萬劍歸宗
<style>#papa {
margin: 0 0 0 calc(50% - 681px);
width: 1200px;
height: 750px;
background: #666 url('https://638183.freep.cn/638183/t22/webp/wjgz.webp') no-repeat center/cover;
box-shadow: 3px 3px 20px #000;
position: relative;
}
#papa::before, #papa::after {
--delay: 0s;
position: absolute;
content: url('https://638183.freep.cn/638183/t22/webp/jm.webp');
opacity: 1;
animation: change 2s var(--delay) infinite alternate;
}
#papa::after { --delay: 1s; top: 40px; right: 40px; transform: rotate(45deg); }
@keyframes change { to {opacity: .15; } }
</style>
<div id="papa"></div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=1453326535" loop autoplay></audio>
<script>
(function(mkPlayer) {let defaults = {lrcAr : [],lrc_css: 'top: 10px; left: 50%; transform: translateX(-50%); --bg: linear-gradient(180deg,hsla(100,10%,50%,.75),hsla(100,100%,20%,.65));',player_css : 'bottom: 10px; left: calc(50% - 60px); --track: hsla(100,30%,80%,.65); --prog: hsla(100,60%,50%,.55); --color: silver;',playerCode : `<style>#mplayer { position: absolute; }#btnwrap { display: block; fill: var(--color); opacity: .85; cursor: pointer; }#btnwrap:hover { opacity: 1; }#track {fill: none; stroke: var(--track); }#prog {fill: none; stroke: var(--prog); }#tmsg { fill: var(--color); stroke: none; font: bold 1em sans-serif; }#lrc { --motion: cover2; --tt: 1s; --state: running; --bg: red; position: absolute; font: bold 2.4em sans-serif; color: hsl(100,100%,90%); white-space: nowrap;-webkit-background-clip: text; filter: drop-shadow(1px 1px 2px hsla(0,100%,0%,.85)); z-index: 900; }#lrc::before { position: absolute; content: attr(data-lrc); width: 20%; height: 100%; color: transparent; overflow: hidden; white-space: nowrap; background: var(--bg); filter: inherit; -webkit-background-clip: text; animation: var(--motion) var(--tt) linear forwards; animation-play-state: var(--state); }@keyframes cover1 { from { width: 0; } to { width: 100%; } }@keyframes cover2 { from { width: 0; } to { width: 100%; } }</style><svg id="mplayer" width="120" height="120"><g id="circle_wrap" transform="rotate(-90, 60, 60)" style="cursor: pointer;"><circle id="track" cx="60" cy="60" r="50" stroke-width="10" /><circle id="prog" cx="60" cy="60" r="50" stroke-width="10" /></g><g id="btnwrap"><path id="btnplay" d="M 50 50,50 70,70, 60 z"></path><path id="btnpause" d="M 52 50,52 70,57 70,57 50,52 50 z M 60 50,60 70,65 70,65 50,60 50 z" style="display: none;"></path><path d="M 57 50,60 50,60 70,57 70 z" fill="transparent" /></g><path id="curPath" d="M 20 70 Q 60 0 100 70" fill="none" stroke="none"/><path id="durPath" d="M 20 55 Q 60 110 100 55" fill="none" stroke="none"/><g id="tmsg"><text x="34" y="0"><textPath id="curMsg" xlink:href="#curPath" dominant-baseline="text-after-edge">00:00</textPath></text><text x="29" y="0"><textPath id="durMsg" xlink:href="#durPath" dominant-baseline="text-before-edge">00:00</textPath></text></g></svg><div id="lrc" data-lrc="花潮论坛lrc在线">花潮论坛lrc在线</div>`,};let playCode = (user_config) => {let data = Object.assign({},defaults,user_config);papa.innerHTML += data.playerCode;mplayer.style.cssText += data.player_css;lrc.style.cssText += data.lrc_css;let mKey = 0, mFlag = true, cc = {x: 1 * track.getAttribute('cx'),y: 1 * track.getAttribute('cy'),len: track.getTotalLength(),};prog.style.strokeDasharray = prog.style.strokeDashoffset = cc.len;btnwrap.onclick = () => aud.paused ? aud.play() : aud.pause();circle_wrap.onclick = (e) => {let deg = Math.atan2(e.offsetY - cc.y, e.offsetX - cc.x) * 180 / Math.PI;deg += (e.offsetX < cc.x && e.offsetY < cc.y) ? 450 : 90;aud.currentTime = aud.duration * deg / 360;};aud.addEventListener('timeupdate', () => {prog.style.strokeDashoffset = cc.len - cc.len * aud.currentTime / aud.duration;curMsg.textContent = toMin(aud.currentTime);durMsg.textContent = toMin(aud.duration);for (j = 0; j < data.lrcAr.length; j++) {if (aud.currentTime >= data.lrcAr) {if (mKey === j) showLrc(data.lrcAr);else continue;}}});aud.addEventListener('pause', () => mState());aud.addEventListener('play', () => mState());aud.addEventListener('seeked', () => calcKey());let mState = () => aud.paused ? (btnplay.style.display = 'block', btnpause.style.display = 'none', lrc.style.setProperty('--state', 'paused')) : (btnplay.style.display = 'none', btnpause.style.display = 'block', lrc.style.setProperty('--state', 'running'));let showLrc = (time) => {let name = mFlag ? 'cover1' : 'cover2';lrc.innerHTML = lrc.dataset.lrc = data.lrcAr;lrc.style.setProperty('--motion', name);lrc.style.setProperty('--tt', time + 's');lrc.style.setProperty('--state', 'running');mKey += 1;mFlag = !mFlag;};let calcKey = () => {for(j = 0; j < data.lrcAr.length; j ++) {if(aud.currentTime <= data.lrcAr) {mKey = j - 1;break;}}if(mKey <0) mKey = 0;if(mKey > data.lrcAr.length - 1) mKey = data.lrcAr.length - 1;let time = data.lrcAr - (aud.currentTime - data.lrcAr);showLrc(time);};let toMin = (val) => {if (!val) return '00:00';val = Math.floor(val);let min = parseInt(val / 60), sec = parseFloat(val % 60);if(min < 10) min = '0' + min;if(sec < 10) sec = '0' + sec;return min + ':' + sec;};};mkPlayer.HCPlayer = playCode;})(this);
let lrcAr = [
,
];
HCPlayer({
lrcAr: lrcAr,
player_css: 'bottom: 20px; left: calc(50% - 60px); --track: #bacac6; --prog: #2edfa3; --color: #e3f9fd; opacity: .85;',
lrc_css: 'top: 20px; left: 50%; transform: translateX(-50%); --bg: #a4e2c6;',
});
</script>
本帖最后由 马黑黑 于 2022-11-18 08:10 编辑
本帖演示测试中的圆环播放器插件。若使用此插件,可以减少播放器、lrc歌词对编写代码的干扰,做帖时能更专注于帖子内容。
使用了播放器插件,你的帖子代码结构将如下所示:
<style>
#papa {
/* css代码 */
}
/* 帖子相关的其他CSS代码 */
</style>
<div id="papa">
<!-- 帖子内容的HTML代码 -->
</div>
<audio id="aud" src="音频地址" loop autoplay></audio>
<script>
//播放器+lrc歌词插件代码(略)
let lrcAr = [
,
];
HCPlayer({
lrcAr: lrcAr,
player_css: 'bottom: 20px; left: 20px; --track: #bacac6; --prog: #2edfa3; --color: #e3f9fd; opacity: .85;',
lrc_css: 'top: 20px; left: 50%; --bg: #a4e2c6;',
});
</script>
彩色部分的代码是基于播放器和lrc歌词的,发帖要操作的部分。其中:
蓝色部分是必须的,它是调用插件功能的固定格式;
红色部分必须给出,同步歌词所依赖的歌词数组(发纯音乐帖子时做标题用);
粉色部分可以不要,不要的话就是使用插件的预设样式。
本帖最后由 马黑黑 于 2022-11-18 08:13 编辑
插件代码(做帖时不用去理睬它,让它放在自己的位置就行):
(function(mkPlayer) {let defaults = {lrcAr : [],lrc_css: 'top: 10px; left: 50%; transform: translateX(-50%); --bg: linear-gradient(180deg,hsla(100,10%,50%,.75),hsla(100,100%,20%,.65));',player_css : 'bottom: 10px; left: calc(50% - 60px); --track: hsla(100,30%,80%,.65); --prog: hsla(100,60%,50%,.55); --color: silver;',playerCode : `<style>#mplayer { position: absolute; }#btnwrap { display: block; fill: var(--color); opacity: .85; cursor: pointer; }#btnwrap:hover { opacity: 1; }#track {fill: none; stroke: var(--track); }#prog {fill: none; stroke: var(--prog); }#tmsg { fill: var(--color); stroke: none; font: bold 1em sans-serif; }#lrc { --motion: cover2; --tt: 1s; --state: running; --bg: red; position: absolute; font: bold 2.4em sans-serif; color: hsl(100,100%,90%); white-space: nowrap;-webkit-background-clip: text; filter: drop-shadow(1px 1px 2px hsla(0,100%,0%,.85)); z-index: 900; }#lrc::before { position: absolute; content: attr(data-lrc); width: 20%; height: 100%; color: transparent; overflow: hidden; white-space: nowrap; background: var(--bg); filter: inherit; -webkit-background-clip: text; animation: var(--motion) var(--tt) linear forwards; animation-play-state: var(--state); }@keyframes cover1 { from { width: 0; } to { width: 100%; } }@keyframes cover2 { from { width: 0; } to { width: 100%; } }</style><svg id="mplayer" width="120" height="120"><g id="circle_wrap" transform="rotate(-90, 60, 60)" style="cursor: pointer;"><circle id="track" cx="60" cy="60" r="50" stroke-width="10" /><circle id="prog" cx="60" cy="60" r="50" stroke-width="10" /></g><g id="btnwrap"><path id="btnplay" d="M 50 50,50 70,70, 60 z"></path><path id="btnpause" d="M 52 50,52 70,57 70,57 50,52 50 z M 60 50,60 70,65 70,65 50,60 50 z" style="display: none;"></path><path d="M 57 50,60 50,60 70,57 70 z" fill="transparent" /></g><path id="curPath" d="M 20 70 Q 60 0 100 70" fill="none" stroke="none"/><path id="durPath" d="M 20 55 Q 60 110 100 55" fill="none" stroke="none"/><g id="tmsg"><text x="34" y="0"><textPath id="curMsg" xlink:href="#curPath" dominant-baseline="text-after-edge">00:00</textPath></text><text x="29" y="0"><textPath id="durMsg" xlink:href="#durPath" dominant-baseline="text-before-edge">00:00</textPath></text></g></svg><div id="lrc" data-lrc="花潮论坛lrc在线">花潮论坛lrc在线</div>`,};let playCode = (user_config) => {let data = Object.assign({},defaults,user_config);papa.innerHTML += data.playerCode;mplayer.style.cssText += data.player_css;lrc.style.cssText += data.lrc_css;let mKey = 0, mFlag = true, cc = {x: 1 * track.getAttribute('cx'),y: 1 * track.getAttribute('cy'),len: track.getTotalLength(),};prog.style.strokeDasharray = prog.style.strokeDashoffset = cc.len;btnwrap.onclick = () => aud.paused ? aud.play() : aud.pause();circle_wrap.onclick = (e) => {let deg = Math.atan2(e.offsetY - cc.y, e.offsetX - cc.x) * 180 / Math.PI;deg += (e.offsetX < cc.x && e.offsetY < cc.y) ? 450 : 90;aud.currentTime = aud.duration * deg / 360;};aud.addEventListener('timeupdate', () => {prog.style.strokeDashoffset = cc.len - cc.len * aud.currentTime / aud.duration;curMsg.textContent = toMin(aud.currentTime);durMsg.textContent = toMin(aud.duration);for (j = 0; j < data.lrcAr.length; j++) {if (aud.currentTime >= data.lrcAr) {if (mKey === j) showLrc(data.lrcAr);else continue;}}});aud.addEventListener('pause', () => mState());aud.addEventListener('play', () => mState());aud.addEventListener('seeked', () => calcKey());let mState = () => aud.paused ? (btnplay.style.display = 'block', btnpause.style.display = 'none', lrc.style.setProperty('--state', 'paused')) : (btnplay.style.display = 'none', btnpause.style.display = 'block', lrc.style.setProperty('--state', 'running'));let showLrc = (time) => {let name = mFlag ? 'cover1' : 'cover2';lrc.innerHTML = lrc.dataset.lrc = data.lrcAr;lrc.style.setProperty('--motion', name);lrc.style.setProperty('--tt', time + 's');lrc.style.setProperty('--state', 'running');mKey += 1;mFlag = !mFlag;};let calcKey = () => {for(j = 0; j < data.lrcAr.length; j ++) {if(aud.currentTime <= data.lrcAr) {mKey = j - 1;break;}}if(mKey <0) mKey = 0;if(mKey > data.lrcAr.length - 1) mKey = data.lrcAr.length - 1;let time = data.lrcAr - (aud.currentTime - data.lrcAr);showLrc(time);};let toMin = (val) => {if (!val) return '00:00';val = Math.floor(val);let min = parseInt(val / 60), sec = parseFloat(val % 60);if(min < 10) min = '0' + min;if(sec < 10) sec = '0' + sec;return min + ':' + sec;};};mkPlayer.HCPlayer = playCode;})(this);
本帖最后由 马黑黑 于 2022-11-18 08:51 编辑
插件的调用与调配——
调用本插件语法:
HCPlayer({
lrcAr: lrc歌词数组,
player_css: 'CSS描述语句',
lrc_css: 'CSS描述语句',
});
共3个接口参数,一一描述如下:
① lrcAr: lrc歌词数组
lrc歌词数组接受标准的花潮LRC在线歌词格式,例如,[, ,],如果是做纯音乐帖,可以是这样:
HCPlayer({
lrcAr: ,
//player_css: 'CSS描述语句',
//lrc_css: 'CSS描述语句',
});
如果是歌词同步帖,因为歌词数组代码量较大,可以先声明,再把数组变量赋值给 lrcAr 接口参数:
let lrcAr = [
,
// 其他歌词数组元素
];
HCPlayer({
lrcAr: lrcAr,
//player_css: 'CSS描述语句',
//lrc_css: 'CSS描述语句',
});
② player_css: 'CSS描述语句'
这个接口接受播放器CSS样式,可以不提供,如果提供,必须包含 left(或right)、top(或bottom)、--track、--prog、--color 这5个属性,其中 --track 是底轨颜色、--prog 是进度轨颜色、--color 是文本和按钮颜色。例:
HCPlayer({
lrcAr: ,
//lrc_css: 'CSS描述语句',
player_css: 'bottom: 20px; left: 50%; --track: #bacac6; --prog: #2edfa3; --color: #e3f9fd;',
});
也可以先声明字串,用变量给接口参数赋值(接口参数还可接受额外的CSS设定,看下面的粉色语句):
let player_css = 'bottom: 20px; left: 50%; --track: #bacac6; --prog: #2edfa3; --color: #e3f9fd; opacity: .8';
HCPlayer({
lrcAr: ,
//lrc_css: 'CSS描述语句',
player_css: player_css,
});
③ lrc_css: 'CSS描述语句'
这个接口参数接受lrc歌词同步的CSS样式,可以不提供,如果提供,则必须包含left(或right)、top(或bottom)、--bg 共3个属性,其中 --bg 用于设定歌词同步颜色。例:
HCPlayer({
lrcAr: ,
lrc_css: 'top: 20px; left: 20px; --bg: #a4e2c6;',
player_css: player_css,
});
也可以先声明字串,用变量给接口参数赋值(接口参数还可接受额外的CSS设定,看下面的粉色语句):
let lrcCss = 'top: 20px; left: 20px; --bg: #a4e2c6; opacity: .95';
let player_css = 'bottom: 20px; left: 50%; --track: #bacac6; --prog: #2edfa3; --color: #e3f9fd; opacity: .8';
HCPlayer({
lrcAr: ,
lrc_css: lrcCss,
player_css: player_css,
});
三个接口参数都不是必须的,所以,调用插件功能最简单的语句是:
HCPlayer({});
但帖子总不能只显示“花潮论坛lrc在线”字样,所以建议至少是这样调用插件:
HCPlayer({ lrcAr: , });
或写成分行的:
HCPlayer({
lrcAr: ,
});
要弄清楚的是,lrc_css 和 player_css 这两个接口参数,如果需要提供,则要求必须包含的参数一个不能少。
本帖最后由 马黑黑 于 2022-11-18 08:52 编辑
一楼帖子完整代码:<style>
#papa {
margin: 0 0 0 calc(50% - 681px);
width: 1200px;
height: 750px;
background: #666 url('https://638183.freep.cn/638183/t22/webp/wjgz.webp') no-repeat center/cover;
box-shadow: 3px 3px 20px #000;
position: relative;
}
#papa::before, #papa::after {
--delay: 0s;
position: absolute;
content: url('https://638183.freep.cn/638183/t22/webp/jm.webp');
opacity: 1;
animation: change 2s var(--delay) infinite alternate;
}
#papa::after { --delay: 1s; top: 40px; right: 40px; transform: rotate(45deg); }
@keyframes change { to {opacity: .15; } }
</style>
<div id="papa"></div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=1453326535" loop autoplay></audio>
<script>
(function(mkPlayer) {let defaults = {lrcAr : [],lrc_css: 'top: 10px; left: 50%; transform: translateX(-50%); --bg: linear-gradient(180deg,hsla(100,10%,50%,.75),hsla(100,100%,20%,.65));',player_css : 'bottom: 10px; left: calc(50% - 60px); --track: hsla(100,30%,80%,.65); --prog: hsla(100,60%,50%,.55); --color: silver;',playerCode : `<style>#mplayer { position: absolute; }#btnwrap { display: block; fill: var(--color); opacity: .85; cursor: pointer; }#btnwrap:hover { opacity: 1; }#track {fill: none; stroke: var(--track); }#prog {fill: none; stroke: var(--prog); }#tmsg { fill: var(--color); stroke: none; font: bold 1em sans-serif; }#lrc { --motion: cover2; --tt: 1s; --state: running; --bg: red; position: absolute; font: bold 2.4em sans-serif; color: hsl(100,100%,90%); white-space: nowrap;-webkit-background-clip: text; filter: drop-shadow(1px 1px 2px hsla(0,100%,0%,.85)); z-index: 900; }#lrc::before { position: absolute; content: attr(data-lrc); width: 20%; height: 100%; color: transparent; overflow: hidden; white-space: nowrap; background: var(--bg); filter: inherit; -webkit-background-clip: text; animation: var(--motion) var(--tt) linear forwards; animation-play-state: var(--state); }@keyframes cover1 { from { width: 0; } to { width: 100%; } }@keyframes cover2 { from { width: 0; } to { width: 100%; } }</style><svg id="mplayer" width="120" height="120"><g id="circle_wrap" transform="rotate(-90, 60, 60)" style="cursor: pointer;"><circle id="track" cx="60" cy="60" r="50" stroke-width="10" /><circle id="prog" cx="60" cy="60" r="50" stroke-width="10" /></g><g id="btnwrap"><path id="btnplay" d="M 50 50,50 70,70, 60 z"></path><path id="btnpause" d="M 52 50,52 70,57 70,57 50,52 50 z M 60 50,60 70,65 70,65 50,60 50 z" style="display: none;"></path><path d="M 57 50,60 50,60 70,57 70 z" fill="transparent" /></g><path id="curPath" d="M 20 70 Q 60 0 100 70" fill="none" stroke="none"/><path id="durPath" d="M 20 55 Q 60 110 100 55" fill="none" stroke="none"/><g id="tmsg"><text x="34" y="0"><textPath id="curMsg" xlink:href="#curPath" dominant-baseline="text-after-edge">00:00</textPath></text><text x="29" y="0"><textPath id="durMsg" xlink:href="#durPath" dominant-baseline="text-before-edge">00:00</textPath></text></g></svg><div id="lrc" data-lrc="花潮论坛lrc在线">花潮论坛lrc在线</div>`,};let playCode = (user_config) => {let data = Object.assign({},defaults,user_config);papa.innerHTML += data.playerCode;mplayer.style.cssText += data.player_css;lrc.style.cssText += data.lrc_css;let mKey = 0, mFlag = true, cc = {x: 1 * track.getAttribute('cx'),y: 1 * track.getAttribute('cy'),len: track.getTotalLength(),};prog.style.strokeDasharray = prog.style.strokeDashoffset = cc.len;btnwrap.onclick = () => aud.paused ? aud.play() : aud.pause();circle_wrap.onclick = (e) => {let deg = Math.atan2(e.offsetY - cc.y, e.offsetX - cc.x) * 180 / Math.PI;deg += (e.offsetX < cc.x && e.offsetY < cc.y) ? 450 : 90;aud.currentTime = aud.duration * deg / 360;};aud.addEventListener('timeupdate', () => {prog.style.strokeDashoffset = cc.len - cc.len * aud.currentTime / aud.duration;curMsg.textContent = toMin(aud.currentTime);durMsg.textContent = toMin(aud.duration);for (j = 0; j < data.lrcAr.length; j++) {if (aud.currentTime >= data.lrcAr) {if (mKey === j) showLrc(data.lrcAr);else continue;}}});aud.addEventListener('pause', () => mState());aud.addEventListener('play', () => mState());aud.addEventListener('seeked', () => calcKey());let mState = () => aud.paused ? (btnplay.style.display = 'block', btnpause.style.display = 'none', lrc.style.setProperty('--state', 'paused')) : (btnplay.style.display = 'none', btnpause.style.display = 'block', lrc.style.setProperty('--state', 'running'));let showLrc = (time) => {let name = mFlag ? 'cover1' : 'cover2';lrc.innerHTML = lrc.dataset.lrc = data.lrcAr;lrc.style.setProperty('--motion', name);lrc.style.setProperty('--tt', time + 's');lrc.style.setProperty('--state', 'running');mKey += 1;mFlag = !mFlag;};let calcKey = () => {for(j = 0; j < data.lrcAr.length; j ++) {if(aud.currentTime <= data.lrcAr) {mKey = j - 1;break;}}if(mKey <0) mKey = 0;if(mKey > data.lrcAr.length - 1) mKey = data.lrcAr.length - 1;let time = data.lrcAr - (aud.currentTime - data.lrcAr);showLrc(time);};let toMin = (val) => {if (!val) return '00:00';val = Math.floor(val);let min = parseInt(val / 60), sec = parseFloat(val % 60);if(min < 10) min = '0' + min;if(sec < 10) sec = '0' + sec;return min + ':' + sec;};};mkPlayer.HCPlayer = playCode;})(this);
let lrcAr = [
,
];
HCPlayer({
lrcAr: lrcAr,
player_css: 'bottom: 20px; left: calc(50% - 60px); --track: #bacac6; --prog: #2edfa3; --color: #e3f9fd; opacity: .85;',
lrc_css: 'top: 20px; left: 50%; transform: translateX(-50%); --bg: #a4e2c6;',
});
</script>
重要:插件约定,帖子父框的id必须是 papa,所以,帖子HTML代码必须是这样的结构:
<div id="papa">...</div> 这个太方便了。那两侧的两把小剑也设计得精巧,这个是JS封装的具体应用,黑黑太棒了{:4_199:} 红影 发表于 2022-11-18 12:56
这个太方便了。那两侧的两把小剑也设计得精巧,这个是JS封装的具体应用,黑黑太棒了
还不够方便,还需要改进一下接口参数。现在差不多调整好了,晚上发出来 欣赏佳作,问候黑黑。 马黑黑 发表于 2022-11-18 13:00
还不够方便,还需要改进一下接口参数。现在差不多调整好了,晚上发出来
太好了,黑黑辛苦了。替花潮人谢谢你{:4_187:} 红影 发表于 2022-11-18 15:57
太好了,黑黑辛苦了。替花潮人谢谢你
先整理几个,其余的有空再做 梦油 发表于 2022-11-18 15:22
欣赏佳作,问候黑黑。
感谢支持 马黑黑 发表于 2022-11-18 17:58
感谢支持
黑黑朋友别客气。 马黑黑 发表于 2022-11-18 17:54
先整理几个,其余的有空再做
把应该css做的事,除了必须的,都封装起来了,这样真方便{:4_187:} 红影 发表于 2022-11-18 20:36
把应该css做的事,除了必须的,都封装起来了,这样真方便
基于播放控制器和歌词的CSS也被封装在里面了 梦油 发表于 2022-11-18 20:18
黑黑朋友别客气。
{:4_191:} 厉害了黑黑,问好{:4_199:} 泡沫 发表于 2022-11-18 21:34
厉害了黑黑,问好
{:4_190:}{:5_108:} 马黑黑 发表于 2022-11-18 21:09
基于播放控制器和歌词的CSS也被封装在里面了
真的太好了,省得看得晕了,下回直接套用封装的,也可以防止不小心就出错了{:4_173:} 红影 发表于 2022-11-18 23:10
真的太好了,省得看得晕了,下回直接套用封装的,也可以防止不小心就出错了
插件的好处多多,即使插件像现在这个样子应用