毒 药(马黑黑原创)
本帖最后由 朵拉 于 2023-8-23 23:38 编辑 <br /><br /><style>#papa { margin: 0 0 0 calc(50% - 593px); width: 1024px; height: 640px; background: url('https://pic.imgdb.cn/item/64e62506661c6c8e5438bc76.jpg') no-repeat center/cover; box-shadow: 3px 3px 20px #000; overflow: hidden; position: relative; display: grid; place-items: center; z-index: 1; --state: running; }
.leaf { position: absolute; font-size: 30px; top: -20%; color: green; opacity: .64; animation: drop var(--duration) var(--delay) infinite linear var(--state); }
@keyframes drop { to { top: 105%; transform: rotate(1turn); } }
</style>
<div id="papa"></div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2066654616" autoplay loop></audio>
<script>
let leaves = ['🍁','🍂','☘','🍀','🌿','🍃'];
let script = document.createElement('script');
script.src = 'https://638183.freep.cn/638183/web/api/plater_lrc.js';
script.charset = 'utf-8';
document.head.appendChild(script);
script.onload = () => {
HCPlayer({
papa: '#papa',
lrcAr: [ ],
player_css: `
right: -4px;
bottom: 10px;
color: blue;
--color1: snow;
--color2: blue;
`,
lrc_css: `
bottom: 15px;
--color: linear-gradient(rgba(216,204,184,.3),rgba(216,204,184,.7));
--bg: linear-gradient(rgba(97,77,48,.25), rgba(97,77,48,.6));
`,
});
}
Array.from({length: 30}).forEach((item, key) => {
item = document.createElement('span');
item.className = 'leaf';
item.innerHTML = leaves;
item.style.cssText += `
left: ${Math.random() * 100}%;
font-size: ${30 + Math.floor(Math.random() * 30)}px;
--duration: ${10 + Math.random() * 10}s;
--delay: ${10 - Math.random() * 25}s;
`;
papa.appendChild(item);
});
</script>
@马黑黑
马师 晚上好,学生交作业,请指正哈~~{:4_190:} 素雅的画面,体现出来的情绪与歌曲相配套。
插件支持歌词同步,歌词应完善起来。 漂亮,欣赏朵宝好帖{:4_187:} 欣赏朵拉的精彩制作{:4_187:}
页:
[1]