《荷东猛士的士高》，黄金珍藏版
本帖最后由 三月的阳光 于 2022-12-10 13:59 编辑 <br /><br /><div class="t_fsz"><table cellspacing="0" cellpadding="0"><tr><td class="t_f" id="postmessage_1793326">
<style>
#papa { margin: auto; width: 711px; height: 400px; background: gray url('https://pic.imgdb.cn/item/63941fe9b1fccdcd3650b0f0.gif') no-repeat center/cover; box-shadow: 3px 3px 20px #000; position: relative; }
</style>
<div id="papa">
</div>
<audio id="aud" src="http://fdfs.xmcdn.com/group65/M01/BA/A6/wKgMal19j82z3yvdAd5YxzIgQJo563.mp3" autoplay loop></audio>
<script>
(function() {
(function(mkPlayer) {let defaults = {player_css: 'bottom: 150px; left: calc(50% - 50px);',playerCode: `<style>#mplayer { position: absolute; --track: hsla(100,30%,80%,.65); --prog: hsla(100,60%,40%,.55); }#btnwrap { display: block; fill: var(--track); opacity: .95; cursor: pointer; }#btnwrap:hover { opacity: 1; }#track { fill: none; stroke: var(--track); }#prog { fill: none; stroke: var(--prog); }</style><svg id="mplayer" width="100" height="100"><g id="circle_wrap" transform="rotate(-90, 50, 50)" style="cursor: pointer;"><circle id="track" cx="50" cy="50" r="40" stroke-width="10" /><circle id="prog" cx="50" cy="50" r="40" stroke-width="10" /></g><g id="btnwrap"><path id="btnplay" d="M 40 40,40 60,60, 50 z"></path><path id="btnpause" d="M 42 40,42 60,47 60,47 40,42 40 z M 50 40,50 60,55 60,55 40,50 40 z" style="display: none;"></path><path d="M 47 50,50 40,50 60,47 60 z" fill="transparent" /></g></svg>`,};let playCode = (user_config) => {let data = Object.assign({}, defaults, user_config);papa.innerHTML += data.playerCode;mplayer.style.cssText += data.player_css;let 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;});aud.addEventListener('pause', () => mState());aud.addEventListener('play', () => mState());aud.addEventListener('seeked', () => aud.play());let mState = () => aud.paused ? (btnplay.style.display = 'block', btnpause.style.display = 'none') : (btnplay.style.display = 'none', btnpause.style.display = 'block');};mkPlayer.HCPlayer = playCode;})(this);
HCPlayer({});
})();
</script>
</td></tr></table> 这个要收藏 学习学习哈~~{:4_205:}{:4_205:} 马黑黑 发表于 2022-12-8 13:34
这个要收藏
报告黑黑老师，我已经收藏了~~{:4_173:} 三月的阳光 发表于 2022-12-8 13:39
报告黑黑老师，我已经收藏了~~
我是说我要收藏{:4_173:} 阳光就一首歌曲 看见是黑的一片{:4_203:} 是不是我手机有问题 马黑黑 发表于 2022-12-8 13:46
我是说我要收藏
你就不用收藏了，代码本来就是你的，音乐在分享版块就有，第一首就是，随时可取也可下载~~{:4_173:}
https://www.huachaowang.com/forum.php?mod=viewthread&tid=41648&extra=page%3D1 辫子哥哥 发表于 2022-12-8 13:52
阳光就一首歌曲 看见是黑的一片
这动态图片可能辫子哥哥的手机感觉不适应~~{:4_173:} 辫子哥哥 发表于 2022-12-8 13:52
是不是我手机有问题
手机肯定没有问题，是图片的问题{:4_190:} 三月的阳光 发表于 2022-12-8 13:57
这动态图片可能辫子哥哥的手机感觉不适应~~
没有看见任何东西，就一个圆播放器 辫子哥哥 发表于 2022-12-8 13:58
没有看见任何东西，就一个圆播放器
哈哈，赶紧换电脑~~{:4_173:} 三月的阳光 发表于 2022-12-8 14:08
哈哈，赶紧换电脑~~
在上班的 辫子哥哥 发表于 2022-12-8 13:58
没有看见任何东西，就一个圆播放器
https://p2.ssl.qhimgs1.com/sdr/400__/t016b97aab31d04f10c.gif
给你看个图片吧~~{:4_173:} 三月的阳光 发表于 2022-12-8 14:08
哈哈，赶紧换电脑~~
最近领导忙，安排任务下来，抽空上来看看了 三月的阳光 发表于 2022-12-8 14:09
给你看个图片吧~~
一直在转，看不见 辫子哥哥 发表于 2022-12-8 14:10
最近领导忙，安排任务下来，抽空上来看看了
我们也是的，我也是抽空上来看看~~{:4_180:} 辫子哥哥 发表于 2022-12-8 14:11
一直在转，看不见
手机不接受动态图吧，我的手机也看不了图片也是转圈~~ 三月的阳光 发表于 2022-12-8 13:53
你就不用收藏了，代码本来就是你的，音乐在分享版块就有，第一首就是，随时可取也可下载~~
htt ...
谢谢。我是说，收藏到我的车载设备 马黑黑 发表于 2022-12-8 14:36
谢谢。我是说，收藏到我的车载设备
{:4_205:}{:4_205:}
页:
[1]
2