<!DOCTYPE html PUBLIC "-//W3C//h2D XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/h2D/xhtml1-transitional.h2d"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>超酷数码钟表 - 妙味课堂 - www.miaov.com</title> <link href="miaov_style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="clock" class="date"> <h2><img src="images/title.png" /></h2> <div class="year"> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img src="images/year.png" alt="year" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img src="images/month.png" alt="month" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img src="images/seven.png" alt="seven" longdesc="http://www.miaov.com" /> </div> <div class="time"> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img src="images/sign.png" alt="sign" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img src="images/sign.png" alt="sign" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img class="num" src="images/0.png" alt="0" longdesc="http://www.miaov.com" /> <img class="pos2" src="images/week.png" alt="week" longdesc="http://www.miaov.com" /> <img class="num2" src="images/one.png" alt="one" longdesc="http://www.miaov.com" /> </div> <div class="url" title="妙味课堂-超酷时钟"><a href="http://www.miaov.com/"><img src="images/miaov.png" alt="妙味课堂" longdesc="http://www.miaov.com" /></a></div> </div> <script type="text/javascript"> (function(){ var num = document.querySelectorAll('.num'); var num2 = document.querySelector('.num2'); var weekImg = [ "images/seven.png", "images/one.png", "images/two.png", "images/three.png", "images/four.png", "images/five.png", "images/six.png" ]; toDate(); setInterval(toDate,1000); function toDate(){ var date = new Date(); var year = date.getFullYear(); var month = toDB(date.getMonth() + 1); var day = toDB(date.getDate()); var hours = toDB(date.getHours()); var minutes = toDB(date.getMinutes()); var seconds = toDB(date.getSeconds()); var week = date.getDay(); var time = year + month + day + hours + minutes + seconds; for(var i = 0; i < num.length; i++){ num[i].src = "images/"+time[i]+".png"; } num2.src = weekImg[week]; } })(); function toDB(nub){ if(nub < 10){ return "0" + nub; } return "" + nub; } </script> </body> </html>
JavaScript超酷时钟的制作
猜你喜欢
转载自www.cnblogs.com/mylgcs/p/9080588.html
今日推荐
周排行