十送红军

马黑黑 发表于 2023-10-3 10:01

马黑黑 发表于 2023-10-3 10:02

帖子代码
<style>
#papa { margin: 0 0 0 calc(50% - 593px); width: 1024px; height: 640px; background: url('https://638183.freep.cn/638183/t23/webp2/sshsjy.webp') no-repeat center/cover; box-shadow: 4px 4px 8px black; overflow: hidden; display: grid; place-items: center; z-index: 1; position: relative; --state: running; }
#papa::before {position: absolute; content: url('https://638183.freep.cn/638183/t22/gif/star.gif'); top: 50px; mix-blend-mode: screen; }
</style>

<div id="papa">
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=281950" autoplay loop></audio>
</div>

<script>

(function() {
let lrcAr = [ , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ];
let js1 = 'https://638183.freep.cn/638183/web/api/svg_path_lrc.js',
js2 = 'https://638183.freep.cn/638183/web/lizi/h5lz_2d.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(js1, () => {
HCPlayer({
papa: '#papa',
lrcAr: lrcAr,
lrc_css: 'top: 20px; --bg: linear-gradient(rgba(200,10,20,.35),rgba(200,10,20,.7)); color: #aaa;',
fs_css: 'transform: translate(0,-35px); background: transparent;',
player_css: 'width: 200px; height: 60px; top: 80px;',
path: 'M10 45 a5 5 0 0 1 5 -5 h170 a5 5 0 0 1 5 5 v5 a5 5 0 0 1 -5 5 h-170 a5 5 0 0 1 -5 -5 v-5',
btn: {left: 34, top: 0},
track: {track: 'olive', prog: 'snow'},
img: {play: '', pause: ''}
});
});

loadJs(js2, () => {
H5lz({
papa: '#papa',
total: 15,
size: {width: 32, height: 32},
shape: {background: 'url("https://638183.freep.cn/638183/t23/btn/hshx.png") no-repeat center/cover', borderRadius: '0'},
ani: 'toTop',
maxTime: 30,
offset: {x: 0, y: 0},
});
});
})();

</script>

梦油发表于 2023-10-3 10:15

现在，想听彭丽媛唱歌可是异想天开了。

红影发表于 2023-10-3 10:30

这个有意思，刚开始以为是以前的那种进度条的加宽，原来是沿着外围的行进。看看路径，可以学习很多{:4_187:}

红影发表于 2023-10-3 10:32

还以为是两半圆，原来是四段小圆弧加两段直线。制作很漂亮{:4_199:}

红影发表于 2023-10-3 10:33

这个还带回帖奖励的呢，每个人可以领10奖，太幸福了{:4_173:}

红影发表于 2023-10-3 10:33

梦油发表于 2023-10-3 10:15
现在，想听彭丽媛唱歌可是异想天开了。

这个帖子里赶紧多回复几个，每个回复都有奖励呢{:4_173:}

梦油发表于 2023-10-3 10:38

红影发表于 2023-10-3 10:33
这个帖子里赶紧多回复几个，每个回复都有奖励呢

谢谢奖励一百钱。

马黑黑 发表于 2023-10-3 10:48

本帖最后由马黑黑于 2023-10-3 10:50 编辑

红影发表于 2023-10-3 10:33
这个还带回帖奖励的呢，每个人可以领10奖，太幸福了
双节奖励力度要大一些

马黑黑 发表于 2023-10-3 10:49

梦油发表于 2023-10-3 10:15
现在，想听彭丽媛唱歌可是异想天开了。

嗯，彭院长的歌还是不错的，听听过去唱的吧

马黑黑 发表于 2023-10-3 10:50

红影发表于 2023-10-3 10:30
这个有意思，刚开始以为是以前的那种进度条的加宽，原来是沿着外围的行进。看看路径，可以学习很多{:4_187: ...

这是矩形 rect 标签转路径的

马黑黑 发表于 2023-10-3 10:51

红影发表于 2023-10-3 10:32
还以为是两半圆，原来是四段小圆弧加两段直线。制作很漂亮

rect → path

马黑黑 发表于 2023-10-3 10:51

梦油发表于 2023-10-3 10:38
谢谢奖励一百钱。

节日快乐

梦油发表于 2023-10-3 11:12

马黑黑发表于 2023-10-3 10:49
嗯，彭院长的歌还是不错的，听听过去唱的吧

是的，现在听到她过去演唱的歌曲另有一番感慨。

梦油发表于 2023-10-3 11:13

马黑黑发表于 2023-10-3 10:51
节日快乐

我们一起开心，我们一起快乐。

马黑黑 发表于 2023-10-3 11:59

梦油发表于 2023-10-3 11:13
我们一起开心，我们一起快乐。

{:4_191:}

马黑黑 发表于 2023-10-3 12:00

梦油发表于 2023-10-3 11:12
是的，现在听到她过去演唱的歌曲另有一番感慨。

没错

魏淑芬 发表于 2023-10-3 13:29

听歌学习，回帖挣钱{:5_106:}{:5_106:}{:5_106:}

梦油发表于 2023-10-3 14:30

马黑黑发表于 2023-10-3 12:00
没错

此一时，彼一时啊！

马黑黑 发表于 2023-10-3 16:23

梦油发表于 2023-10-3 14:30
此一时，彼一时啊！

{:4_181:}

页: [1] 2 3 4 5 6 7 8 9 10

花潮论坛's Archiver

十送红军