最近买了一个服务器 搭建了个博客。 看到别人博客有个 类似时间戳的东西
我也想弄一个但我没有学过这门语言就从网上找到的代码 但是我不会改写。。。
源代码效果是这样的
我想把它改成 跟上边时间戳一样的效果 要怎么做呢。
下面是那个飞机进度的源代码
[HTML] 纯文本查看 复制代码 <!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title></title>
<style type="text/css">
body{
background: #f2f2f2;
}
.main{
height: 30px;
width:500px;
background: #787878;
margin:100px auto;
border-radius: 3px;
}
.inner{
height: 20px;
width: 0;
background: #e4a348;
position: relative;
top: 2px;
left: 5px;
border-radius: 2px;
overflow: hidden;
}
.line{
position: relative;
left: 5px;
top: 14px;
width: 490px;
border-top: 3px dashed #fff;
}
img{
position: absolute;
top: 103px;
left: 395px;
}
.data{
height: 24px;
width:43px;
border: 1px solid;
position: absolute;
left: 396px;
top: 65px;
text-align: center;
}
</style>
</head>
<body>
<div class="data"></div>
<div class="main">
<div class="line"></div>
<div class="inner">
</div>
<img src="../images/1.gif" >
</div>
<script type="text/javascript">
var _width =0;
var timer;
timer = setInterval(function(){
_width +=5;
if(_width>150){
document.getElementsByClassName("inner")[0].style.background="#004c8a";
}
if(_width>350){
document.getElementsByClassName("inner")[0].style.background="#cd4c49";
}
if(_width>=490){
clearInterval(timer);
}
document.getElementsByClassName("inner")[0].style.width=_width+"px";
document.getElementsByTagName("img")[0].style.left=395+_width+"px";
var _data = Math.floor((_width/490)*100);
document.getElementsByClassName("data")[0].innerText = _data+"%";
document.getElementsByClassName("data")[0].style.left=396+_width+"px";
},1000/5);
</script>
</body>
</html> | 
发表于 2021-8-2 14:42
|
发表于 2021-8-2 17:25
