绿叶清舟 发表于 2022-9-3 11:25

加林森 发表于 2022-9-3 11:19
是啊

还好台风来了,这几天凉快了很多

加林森 发表于 2022-9-3 11:42

本帖最后由 加林森 于 2022-10-9 20:02 编辑 <br /><br />绿叶清舟 发表于 2022-9-3 11:25
还好台风来了,这几天凉快了很多
我们这里也凉快了。

<style>
#papa { left: -214px; width: 1024px; height: 640px; background: gray url('https://pic1.imgdb.cn/item/63425d0116f2c2beb13e4d1f.jpg') no-repeat center/cover; box-shadow: 3px 3px 20px #000; position: relative; z-index: 1; }
#tit { position: absolute; left: 270px; top: 220px; font: bold 2.5em sans-serif; color: #ccc; text-shadow: 2px 2px 4px #b00429; letter-spacing: 2px; }
#btnplay { position: absolute; bottom: 40px; left: 100px; width: 100px; height: 100px; border-radius: 50%; box-shadow: 20px 15px 0 0 yellow; cursor: pointer; animation: swing 1s linear infinite alternate; }
#btnplay::before { position: absolute; content: ''; left: 20px; top: 15px; width: 100%; height: 100%;}
#btnplay::after { position: absolute; content: ''; left: 30px; top: 30px; width: 30%; height: 30%; border-radius: 50%; background: yellow; box-shadow: 0 0 30px 0px yellow, 0 0 100px 0 snow; }
@keyframes swing { from { transform: rotate(0deg); } to { transform: rotate(30deg); } }
</style>

<div id="papa">
      <span id="tit">那年夏天 阳光正好</span>
      <span id="btnplay" title="播放/暂停"></span>
</div>

<script>
(function() {
      let aud = new Audio();
      aud.src = 'https://music.163.com/song/media/outer/url?id=428391474.mp3';
      aud.loop = true;
      aud.play();
      btnplay.style.animationPlayState = aud.paused ? 'paused' : 'running';
      btnplay.onclick = () => mplay();
      let mplay = () => aud.paused ? (aud.play(), btnplay.style.animationPlayState = 'running') : (aud.pause(), btnplay.style.animationPlayState = 'paused');
}());
</script>

绿叶清舟 发表于 2022-9-3 20:05

加林森 发表于 2022-9-3 11:42
我们这里也凉快了。

已经九月不会再热了吧

醉美水芙蓉 发表于 2022-9-3 21:00

加林森 发表于 2022-9-3 21:20

绿叶清舟 发表于 2022-9-3 20:05
已经九月不会再热了吧

应该不会了。

加林森 发表于 2022-9-3 21:20

醉美水芙蓉 发表于 2022-9-3 21:00
队长做得漂亮!

谢谢啊!
页: 1 2 [3]
查看完整版本: 下雨天 - 与少年他/芝麻Mochi