加林森 发表于 2021-11-22 00:06

本帖最后由 加林森 于 2022-2-14 21:31 编辑 <br /><br />本队睡觉开启
<img src="https://pic.imgdb.cn/item/620a34012ab3f51d91c4dca6.jpg">

<style type="text/css">


#paDiv { margin: auto; width: 220px; display: flex; align-items: center; border: 1px solid olive; border-radius: 8px 0px 8px 0px; background: rgba(0,0,0,.8); box-shadow: 1px 1px 2px #000; }
#jindu { position: relative; width: 200px; height: 8px; line-height: 8px; font-size: 10px; color: #eee; text-align: center; background: linear-gradient(90deg, olive, green) no-repeat; background-size: 8px 0px; cursor: pointer; }
#btn-ro { width: 20px; height: 20px; line-height: 20px; font-size: 12px; background: linear-gradient(blue, silver, red); outline:none; color: white; border-radius: 50%; text-align: center; cursor: pointer; animation: rol linear 2s infinite; }
#btn-ro:hover { opacity: 0.8; }
#btn-ro:active { opacity: 1; }
@keyframes rol { to { transform:rotate(360deg); } }
</style>


<div id="paDiv">
      <div id="btn-ro">·</div>
      <div id="jindu">
                <div id="jd-go"></div>
      </div>
</div>

<script language="javascript">

var btn = document.getElementById('btn-ro');
var jindu = document.getElementById('jindu');
var aud = document.createElement('audio');
aud.loop = true;
// 音乐地址放在下行引号内
aud.src = "https://www.joy127.com/url/88656.mp3";
aud.addEventListener('ended', function() { btn.style.animationPlayState="paused"; }, true);
aud.addEventListener('timeupdate', tmMsg, true);
aud.play();

function tmMsg(){ //进度条
      let auT = Math.floor(aud.duration - aud.currentTime);
      let auM = auT / 60;
      let auMs = parseInt(auM);
      if (auMs <10) auMs = "0" + auMs;
      let auS = auT % 60;
      let auSs = Math.round(auS);
      if (auSs < 10) auSs = "0" + auSs;
      jindu.innerHTML = "- " + auMs +":" + auSs;
      let jd = (100*aud.currentTime)/aud.duration;
      jindu.style.backgroundSize = jd+ "% 8px";
}

jindu.onclick = function(){ //进度控制
      let w = offset(jindu,"left");
      var x = (event.clientX - w) * aud.duration / jindu.clientWidth;
      aud.currentTime = x;
}

function offset(obj,direction){//获取父级元素偏移总量
      let offsetDir = "offset" + direction.toUpperCase()+direction.substring(1);
      let realNum = obj;
      let positionParent = obj.offsetParent;
      while(positionParent != null){
                realNum += positionParent;
                positionParent = positionParent.offsetParent;
      }
      return realNum;
}

btn.onclick = function(){ // 暂停&播放
      aud.paused ? (aud.play(), btn.style.animationPlayState="running") : (aud.pause(), btn.style.animationPlayState="paused");
}


</script>

马黑黑 发表于 2021-11-22 07:41

加林森 发表于 2021-11-21 23:18
不是我说的有道理，没有钱你怎么活啊？

你说的钱钱有道理

加林森 发表于 2021-11-22 13:07

马黑黑 发表于 2021-11-22 07:41
你说的钱钱有道理

必须的

马黑黑 发表于 2021-11-22 18:42

加林森 发表于 2021-11-22 13:07
必须的

有钱能使鬼推磨

加林森 发表于 2021-11-22 19:13

马黑黑 发表于 2021-11-22 18:42
有钱能使鬼推磨

就是嘛，有钱就行啊。

马黑黑 发表于 2021-11-22 19:27

加林森 发表于 2021-11-22 19:13
就是嘛，有钱就行啊。

钱不是万能的，没钱是万万不能的

加林森 发表于 2021-11-22 19:42

马黑黑 发表于 2021-11-22 19:27
钱不是万能的，没钱是万万不能的

屁话

马黑黑 发表于 2021-11-22 19:44

加林森 发表于 2021-11-22 19:42
屁话

中听

加林森 发表于 2021-11-22 19:54

马黑黑 发表于 2021-11-22 19:44
中听

好的好的

马黑黑 发表于 2021-11-22 20:20

加林森 发表于 2021-11-22 19:54
好的好的

嗯呢

加林森 发表于 2021-11-22 20:27

马黑黑 发表于 2021-11-22 20:20
嗯呢

有理咱就说

马黑黑 发表于 2021-11-22 20:27

加林森 发表于 2021-11-22 20:27
有理咱就说

有理走遍天下

加林森 发表于 2021-11-22 20:52

马黑黑 发表于 2021-11-22 20:27
有理走遍天下

无理寸步难行

马黑黑 发表于 2021-11-22 22:25

加林森 发表于 2021-11-22 20:52
无理寸步难行

不行就不行

加林森 发表于 2021-11-22 22:54

马黑黑 发表于 2021-11-22 22:25
不行就不行

哈哈哈哈。老黑话真多。

马黑黑 发表于 2021-11-22 23:17

加林森 发表于 2021-11-22 22:54
哈哈哈哈。老黑话真多。

话多又不用缴税

加林森 发表于 2021-11-22 23:21

马黑黑 发表于 2021-11-22 23:17
话多又不用缴税

也是啊

加林森 发表于 2021-11-22 23:58

{:5_102:}准备睡觉了

加林森 发表于 2021-11-23 00:04

睡觉开始{:5_110:}

加林森 发表于 2021-11-23 00:05

各位拜拜！！！！！！！！！！！！！！！！！！！！！
页: 1 2 [3] 4
查看完整版本: 不行了，坚持不住了，睡觉去！