|
|

楼主 |
发表于 2023-9-10 22:29
|
显示全部楼层
帖子代码
- <style>
- #papa { margin: 0 0 0 calc(50% - 593px); width: 1024px; height: 640px; background: url('https://638183.freep.cn/638183/t23/webp2/strobe.webp') no-repeat center/cover; box-shadow: 3px 3px 20px #000; z-index: 1; display: grid; place-items: center; position: relative; }
- #sky { position: absolute; width: 100%; height: 40%; top: 0; overflow: hidden; }
- </style>
- <div id="papa">
- <div id="sky"></div>
- </div>
- <audio id="aud" src="https://music.163.com/song/media/outer/url?id=22417149" autoplay loop></audio>
- <script>
- let jsFile1 = 'https://638183.freep.cn/638183/web/api/ewave_lrc.js', jsFile2 = 'https://638183.freep.cn/638183/web/lizi/h5lz_02.js';
- let loadJs = (url, callback) => {
- let body = document.querySelector('body'),
- jsNode = document.createElement('script');
- jsNode.charset = 'utf-8';
- jsNode.setAttribute('src', url);
- body.appendChild(jsNode);
- jsNode.onload = () => callback();
- };
- loadJs(jsFile1, () => {
- let geci = [[2,"Strobe",6],[10,"",1]];
- HCPlayer({
- papa: '#papa',
- lrcAr: geci,
- lrc_css: `
- top: 20px;
- color: lightblue;
- --bg: linear-gradient(rgba(200,200,250,.25),rgba(100,200,250,.65));
- `,
- player_css: `
- bottom: 20px;
- transform: rotate(45deg);
- --bg: rgb(200,200,90,.75);
- --br: 50%;
- `,
- fs_css: '--bg: transparent;',
- });
- });
- loadJs(jsFile2, () => {
- H5lz({
- papa: '#sky',
- total: 20,
- size: {width: 20, height: 3},
- shape: {background: 'linear-gradient(to right,transparent,rgba(0,250,250,.4))', borderRadius: '0'},
- maxTime: 30,
- offset: {x: 00, y: 100},
- ani: 'toRight',
- css: 'transform: rotate(15deg);',
- });
- });
- </script>
复制代码
|
|