<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style>
img{
width: 150px;
height: 200px;
margin: 50px auto;
display: inline-block;
}
body{
background-color: black;
color: white;
font-size: 50px ;
text-align: center ;
margin-left: 150px;
/*margin-top: 100px;*/
/*margin:50px 200px;*/
}
/*span{*/
/*width: 20px;*/
/*height: 100px;*/
/*display: inline-block;*/
/*background-color: white;*/
/*}*/
div{
/*width: 800px;*/
/*height: 1200px;*/
display: inline-block;
float: left;
height: 230px;
line-height: 300px;
font-size: 118px;
margin-top:100px;
}
/*h2{*/
/*display: inline-block;*/
/*margin-top: 100px;*/
/*}*/
#BIG{
margin-top: 50px;
}
#SMALL{
margin-top: -20px;
margin-left:180px;
}
</style>
<body>
<div id="BIG">
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
</div>
<div id="SMALL">
<div id="div_big">
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
</div>
<div>:</div>
<div>
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
</div>
<div>:</div>
<div>
<img src="钻石数字0-9/0.jpg" alt=""/>
<img src="钻石数字0-9/0.jpg" alt=""/>
</div>
</div>
<script>
// var str=[1,2,3,4,5,6];
var small=document.getElementById('SMALL');
var imgs=small.getElementsByTagName('img');
var big=document.getElementById('BIG');
var img=big.getElementsByTagName('img');
function show(n){
if(n<10){
return '0'+n;
}else{
return '' +n;
}
}
// alert(str);
window.οnlοad=function(){
function show1(){
var oDate=new Date();
var stt=oDate.getFullYear()+show(oDate.getMonth()+1)+show(oDate.getDate());
// alert(stt);
var str=show(oDate.getHours())+show(oDate.getMinutes())+show(oDate.getSeconds());
for(var i=0;i<imgs.length;i++){
// imgs[i].src='数字0-9/'+str[i]+'.png'
imgs[i].src='钻石数字0-9/'+str.charAt(i)+'.jpg'
}
for(var i=0;i<img.length;i++){
img[i].src='钻石数字0-9/'+stt.charAt(i)+'.jpg';
}
}
setInterval(show1,1000);
show1();
}
</script>
</body>
</html>
效果如下：：
无意之作~~
175
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
