提前祝论坛朋友父亲节快乐！
本帖最后由 醉美水芙蓉 于 2022-6-16 06:57 编辑 <br /><br /><div class="t_fsz">
<table cellspacing="0" cellpadding="0">
<style>
.outer { left: -220px; width: 1200px; height: 642px; background: url('https://s1.ax1x.com/2022/06/15/XTjlZD.jpg') no-repeat; overflow: hidden; position: relative; }
.sky { position: absolute; width: inherit; height: 270px; background: url('/data/attachment/forum/202206/03/202728j87yxyk38w3cwc3g.png'); animation: cloud_fly 40s linear infinite; }
.outer meter { position: absolute; width: 100px; left: 940px; bottom: 80px; transform: rotate(-90deg); cursor: pointer; }
.btn { position: absolute; left: 950px; bottom: 110px; width: 80px; height: 10px; background: green; border-radius: 0 100%;cursor: pointer; animation: btn_rot 1s linear infinite; }
.btn::before { position: absolute; content: ''; left: calc(50% - 5px); top: calc(50% - 40px); width: 10px; height: 80px; background: darkgreen; border-radius: 0 100%; }
@keyframes cloud_fly { from { background-position: 0 0; } to { background-position: -799px 0; } }
@keyframes btn_rot { to { transform: rotate(1turn); } }
</style>
<div class="outer">
<div class="sky"></div>
<meter id="meter" min="0" max="100" low="33" high="66" optimum="80" value="0"></meter>
<div class="btn"></div>
</div>
<audio id="aud" src="https://www.qqmc.com/up/kwlink.php?id=223842196" autoplay="autoplay" loop="loop"></audio>
<script>
let meter = document.querySelector('#meter'), aud = document.querySelector('#aud'), btn = document.querySelector('.btn');
aud.addEventListener('timeupdate', () => {
meter.value = aud.currentTime / aud.duration * 100;
});
btn.onclick = meter.onclick = () => aud.paused ? (aud.play(), btn.style.animationPlayState = 'running') : (aud.pause(), btn.style.animationPlayState = 'paused');
</script>
</td></tr></table>
父爱如山，挺好的意境 不错的制作。大赞！{:4_199:} 意境好，创意好，画面温馨。{:4_178:} 马黑黑 发表于 2022-6-15 22:32
父爱如山，挺好的意境
提前祝黑黑老师父亲节快乐！ 加林森 发表于 2022-6-15 22:36
不错的制作。大赞！
提前祝队长父亲节快乐！ 樵歌 发表于 2022-6-16 06:54
意境好，创意好，画面温馨。
提前祝樵歌父亲节快乐！ 醉美水芙蓉 发表于 2022-6-16 06:57
提前祝黑黑老师父亲节快乐！
父亲节是下个周日。有心了！
歌曲很不错 醉美水芙蓉 发表于 2022-6-16 06:57
提前祝队长父亲节快乐！
谢谢水芙蓉！ 这个制作真棒，体现了父爱如山的主题。借水芙蓉好贴，同祝天下的父亲们节日快乐{:4_187:} 红影 发表于 2022-6-16 09:28
这个制作真棒，体现了父爱如山的主题。借水芙蓉好贴，同祝天下的父亲们节日快乐
红影美女下午好！同祝天下的父亲父亲节快乐！ 祝花潮的所有父亲们父亲节快乐！祝天下的父亲们幸福安康！谢谢水芙蓉朋友！ 梦油 发表于 2022-6-16 17:40
祝花潮的所有父亲们父亲节快乐！祝天下的父亲们幸福安康！谢谢水芙蓉朋友！
老师晚上好！提前祝梦油老师父亲节快乐！ 醉美水芙蓉 发表于 2022-6-16 17:02
红影美女下午好！同祝天下的父亲父亲节快乐！
嗯嗯，父亲节马上要到了呢{:4_204:} 醉美水芙蓉 发表于 2022-6-16 20:17
老师晚上好！提前祝梦油老师父亲节快乐！
谢谢，谢谢！祝你和你的家人节日快乐。 醉美水芙蓉 发表于 2022-6-16 06:58
提前祝樵歌父亲节快乐！
谢谢哈。{:4_190:}
页:
[1]