您的位置：首页 > 其它

模拟时间

2016-07-26 21:28 295 查看

<!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.onload=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>

效果如下：：

无意之作~~

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航