你的酒馆对我打了烊(学习黑黑H5粒子插件 + 播放器插件)
<style>#mydiv { margin: 80px 0 0 calc(50% - 681px); display: grid; place-items: center; width: 1200px; height: 675px; border: 1px solid gray; background: linear-gradient(to left bottom, rgba(70,70,var(--bb),.5) 0, rgba(var(--bb),100,100,.35) 50%), url('https://s1.ax1x.com/2023/09/09/pP62E1s.jpg') no-repeat center/cover; overflow: hidden; z-index: 1; position: relative; --state: running; }
#pic1 { position: absolute; right: -25px; bottom: 152px; width: 516px; height: 208px; opacity: 0.3;mix-blend-mode: screen; z-index: 1; }
</style>
<div id="mydiv"><img id="pic1" src="https://pic.imgdb.cn/item/64fbe418661c6c8e54e188c1.gif" alt="" /></div>
<audio id="aud" src="https://yinyue1111.s3-us-east-1.ossfiles.com/jiuguan.mp3" crossorigin="anonymous" loop autoplay></audio>
<script>
(function() {
let appends = [];
let loadJs = (pa,src) => {
let script = document.createElement('script');
script.charset = 'utf-8';
script.src = src;
pa.appendChild(script);
appends.push(script);
}
loadJs(document.body,'https://638183.freep.cn/638183/web/api/xyanklet_lrc.js');
loadJs(document.body,'https://638183.freep.cn/638183/web/lizi/h5lz_01.js');
let num = 100, step = 10;
appends.onload = () => {
let geci = [
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
];
let flash = () => {
num += step;
if(num > 255 || num < 0) step = -step;
mydiv.style.setProperty('--bb', num);
};
setInterval(()=> {
if(aud.paused) return false;
flash();
},100);
HCPlayer({
papa: '#mydiv',
lrcAr: geci,
lrc_css: 'top: 30px;left: 50px; color: silver; --bg: linear-gradient(rgba(148,176,255,.4),rgba(148,176,255,.7));',
fs_css: 'bottom: -70px; --bg: darkgray;',
player_css: `
bottom: 50px; left: 400px;
color: white;
--btnBg: url('https://pic.imgdb.cn/item/64f35a26661c6c8e54df3975.png') no-repeat center/cover;
--ww: 50%; --hh: 80px;
--track: lightgreen; --prog: purple;
`,
pinpu: {size: 2, gap: 0, color1: 'blue', color2: ''},
});
};
appends.onload = () => {
H5lz({
papa: '#mydiv',
total: 6,
size: {width: 68, height: 100},
shape: {background: 'url("https://s1.ax1x.com/2023/09/09/pP62yjI.png")', borderRadius: '0'},
maxTime: 24,
offset: {x: 00, y: -300},
ani: 'toRight',
});
};
})();
</script> 休息天,看到黑黑的新效果,赶紧跟着做一个。感谢黑黑的代码{:4_187:} 再复习一下上一个帖子里的底图变色效果,我去掉了第二个颜色里的公式,直接就让它变色了。主要想看看效果如何。{:4_173:}时间也调得慢了些,正好刚问了黑黑时间在哪调的。谢谢黑黑指教{:4_187:} 本地测试的时候有时飘飞的酒杯不出来?貌似也无法调整它的大小和透明度,只能调好了再上传的。找了个斜向的酒杯,也不太好看,就这样直着飘吧{:4_173:} 右上让那个它在蓝色的范畴里变化的,左下是红色范围里变的,貌似颜色不明显。还是带公式的那个应该更清晰些。嗯嗯,得到个结论也好。 漫天飘逸的酒杯好浪漫哦! 看样纸电力不足,灯都疲软了,不得不打烊?
好吧,奶奶叫俺回家喝酒 {:4_206:} 酒杯会不会飞到俺家{:4_170:} 醉美水芙蓉 发表于 2023-9-9 11:58
已经飞到黑黑老师家里了!
没瞧见呀 酒馆打烊,你可以喝水啊。。。{:4_180:} 梦油 发表于 2023-9-9 11:37
漫天飘逸的酒杯好浪漫哦!
可以美酒加咖啡一杯再一杯{:4_173:} 马黑黑 发表于 2023-9-9 11:50
看样纸电力不足,灯都疲软了,不得不打烊?
好吧,奶奶叫俺回家喝酒
酒馆老板欠债逃跑了,酒馆开不下去了{:4_189:} 马黑黑 发表于 2023-9-9 11:50
酒杯会不会飞到俺家
必须的啊,想要多有有多少{:4_173:} 东篱闲人 发表于 2023-9-9 13:31
酒馆打烊,你可以喝水啊。。。
哈哈,东篱大哥把喝水的事接得这么好,太想不到了{:4_182:} 红影 发表于 2023-9-9 14:52
必须的啊,想要多有有多少
那太好了,连网街都不用逛了 红影 发表于 2023-9-9 14:52
酒馆老板欠债逃跑了,酒馆开不下去了
倒闭了 红影 发表于 2023-9-9 14:51
可以美酒加咖啡一杯再一杯
我退休以前一直喝咖啡,退休以后该喝茉莉花茶了。 漂亮,亲爱的速度的,黑黑今天的新的教程立马出来了{:4_199:} 打开帖子就听到了很熟的一首歌,这酒馆还很幽静的,没有电光闪烁,但酒杯翩翩起舞了{:4_199:}