张红 发表于 2023-7-1 16:41

李采霞- 《浪漫恋歌》



<style >
#papa { left: 0px; top: 30px;width: 1000px; height: 600px; background: url('http://storage.live.com/items/1965B2B1656C2AF6!16459?') no-repeat center/cover; box-shadow: 0px0px 0px #000; position: relative; display: grid; place-items: center; user-select: none; z-index: 1; --opt: .25; }

#mLiDiv {position: relative; margin-top: 0px;margin-left: 400px; color:#000; width:280px;height:200px; font-size:16px; }
#mLiDiv a { text-decoration: none; cursor:pointer; }
#mLiDiv a:hover { color:#ff00ff; }
</style>
<div id="papa">
    <div id="mLiDiv"></div>

</div>
<script >

var muAr = [
["http://fs.ringop.kugou.com/G187/M05/18/03/W4cBAF5O9XqAIsCTAC_2DB041Vo852.mp3","李采霞-平安追想曲"],["http://fs.ringop.kugou.com/KGTX/CLTX001/9a9bd1b96c8476d8157f58a101270803.mp3","李采霞-秋的怀念"],["http://fs.ringop.kugou.com/KGTX/CLTX001/55429412b87b27b23377bcb727b2965f.mp3","李采霞-三年"],["http://fs.ringop.kugou.com/KGTX/CLTX001/908e6bc4662d52139cb410afcfd3706d.mp3","李采霞-把爱妻还给我"],["http://fs.ringop.kugou.com/KGTX/CLTX001/e1d539b592b6ca12a20d1d516b8ae601.mp3","李采霞-蒙蒙细雨忆当年"],["http://fs.ringop.kugou.com/KGTX/CLTX001/0f2fa068de58a5f68d622fff2ac1dd9d.mp3","李采霞-天涯芳草"],["http://fs.ringop.kugou.com/KGTX/CLTX001/efaba010be5945e50db06971199f9984.mp3","李采霞-请你放开我"],["http://fs.ringop.kugou.com/KGTX/CLTX001/f5134385606626687852a8550abf154f.mp3","李采霞-真情比酒浓"],["http://fs.ringop.kugou.com/KGTX/CLTX001/aee4f59a064743aa513ebe1b03379aad.mp3","李采霞-心有千千结"],["http://fs.ringop.kugou.com/KGTX/CLTX001/142f918958887958c3e9008c72efa316.mp3","李采霞-寂寞伴柔情"],["http://fs.ringop.kugou.com/KGTX/CLTX001/1f80f67d9eea43d84cdc57e1849a6f41.mp3","李采霞-夜空"],["http://fs.ringop.kugou.com/KGTX/CLTX001/34c190bb367e9bbc1f8707bfea19ad8f.mp3","李采霞-离情"]
      ];
var mLi = document.getElementById('mLiDiv');
var aud = document.createElement('audio');
aud.autoplay = true;
var id = 0;
var str = "";
for(j=0; j<muAr.length; j++) {
      str += (j+1) + ".<a id='list" + j + "' onclick='loadsound(" + j + ")' >" + muAr + "</a><br />";
}
mLi.innerHTML += str;
function loadsound(idx){
   id = idx;
      aud.src = muAr;
      aud.play();
      nameRed(id);
}
aud.onended = function() {
      id++;
      if(id >= muAr.length) id = 0;
    aud.src = muAr;
    aud.play();
nameRed(id);
}
function nameRed(){
      for(k=0;k<muAr.length;k++){
                let listId = "list" + k;
                document.getElementById(listId).style.removeProperty("color");
      }
      listId = "list" + id;
      document.getElementById(listId).style.color = "red";
}


loadsound(id);
</script>

糊图花 发表于 2023-7-1 17:26

问好张红！{:1_292:}

糊图花 发表于 2023-7-1 17:26

欣赏佳作来了

糊图花 发表于 2023-7-1 17:27

精彩，好听

糊图花 发表于 2023-7-1 17:27

学习，点赞 {:1_293:}

糊图花 发表于 2023-7-1 17:27

祝 开心每一天！

糊图花 发表于 2023-7-1 17:27

谢谢楼主分享

巫荣云师 发表于 2023-7-1 20:02

欣赏收藏老师的佳作《浪漫恋歌》。问好点赞!

久久. 发表于 2023-7-1 22:40

晚上好！{:1_292:}   

久久. 发表于 2023-7-1 22:40

帖子制作的漂亮    
页: [1] 2
查看完整版本: 李采霞- 《浪漫恋歌》