我偶尔用
主要是我不明白的事太多{:4_170:} 红影 发表于 2022-2-16 14:47
主要是我不明白的事太多
我有其他的，当前用必应比较多 马黑黑 发表于 2022-2-16 14:51
我有其他的，当前用必应比较多
哦哦，是说使用不同的搜索工具，还以为是说疑问的多少{:4_173:} 红影 发表于 2022-2-16 15:07
哦哦，是说使用不同的搜索工具，还以为是说疑问的多少
谁都会用搜索的 马黑黑 发表于 2022-2-16 15:08
谁都会用搜索的
是的，毕竟有那么多想知道的东西。 红影 发表于 2022-2-16 15:20
是的，毕竟有那么多想知道的东西。
搜索简化了很多事情。之前网络没那么发达时，查找一个函数或方法需要翻书，如果书本不齐全，一整天也翻不到自己想要的 马黑黑 发表于 2022-2-16 16:09
搜索简化了很多事情。之前网络没那么发达时，查找一个函数或方法需要翻书，如果书本不齐全，一整天也翻不 ...
搜索包罗万象，不仅是代码语句，还有很多很多其他方方面面的内容。网络开拓了人的视野。 红影 发表于 2022-2-16 20:48
搜索包罗万象，不仅是代码语句，还有很多很多其他方方面面的内容。网络开拓了人的视野。
网络改变了世界，改变了我们的学习、工作与生活 马黑黑 发表于 2022-2-16 20:53
网络改变了世界，改变了我们的学习、工作与生活
为知识的共享带来了更多的可能。 红影 发表于 2022-2-16 21:21
为知识的共享带来了更多的可能。
没错的 马黑黑 发表于 2022-2-16 21:31
没错的
不过，也分散了人的精力，只有专注的人才有机会更好地利用网络资源。 再来试一试：
<style type="text/css">
#paDiv {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/88693.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>
成功，老黑的教程就是厉害。{:4_199:} 加林森 发表于 2022-2-21 10:09
成功，老黑的教程就是厉害。
{:5_112:} 马黑黑 发表于 2022-2-22 20:13
【新提醒】《相会在梦里》 林翠萍 (同步高亮歌词) - 欢乐水吧 - 花潮论坛 - Powered by Discuz!
https://www.huachaowang.com/forum.php?mod=viewthread&tid=57242&extra=page%3D1
你帮着我看看，这个制作行不行？{:4_190:} 加林森 发表于 2022-2-22 20:32
【新提醒】《相会在梦里》 林翠萍 (同步高亮歌词) - 欢乐水吧 - 花潮论坛 - Powered by Discuz!
https:/ ...
lrc歌词时间对的话，offset设为0，基本没多大问题吧 马黑黑 发表于 2022-2-23 09:53
lrc歌词时间对的话，offset设为0，基本没多大问题吧
嗯嗯，谢谢！
页:
1
[2]