
<style type="text/css">
body{background:#00080a}
.clock {width:230px;margin:0 auto; padding:30px; border:0px solid #333; color:#fff; }
#Date { font-family:'BebasNeueRegular', Arial, Helvetica, sans-serif; font-size:17.5px; text-align:center; text-shadow:0 0 5px #00c6ff; }
.ys { width:230px; margin:0 auto; padding:0px; list-style:none; text-align:center; }
.ys2 { display:inline; font-size:2.5em; text-align:center; font-family:'BebasNeueRegular', Arial, Helvetica, sans-serif; text-shadow:0 0 5px #00c6ff; }
#point { position:relative; -moz-animation:mymove 1s ease infinite; -webkit-animation:mymove 1s ease infinite; padding-left:10px; padding-right:10px; }
@-webkit-keyframesmymove
{
0% {opacity:1.0; text-shadow:0 0 20px #00c6ff;}
50% {opacity:0; text-shadow:none; }
100% {opacity:1.0; text-shadow:0 0 20px #00c6ff; }
}
@-moz-keyframesmymove
{
0% {opacity:1.0; text-shadow:0 0 20px #00c6ff;}
50% {opacity:0; text-shadow:none; }
100% {opacity:1.0; text-shadow:0 0 20px #00c6ff; }
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script><!--网站已经调用这段,可以删除-->
<script type="text/javascript">
$(document).ready(function() {
var monthNames = [ "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12" ];
var dayNames= ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]
var newDate = new Date();
newDate.setDate(newDate.getDate());
$('#Date').html(newDate.getFullYear() + " 年 " + monthNames[newDate.getMonth()] + ' 月 ' + newDate.getDate() + ' 日 ' + dayNames[newDate.getDay()]);
setInterval( function() {
var seconds = new Date().getSeconds();
$("#sec").html(( seconds < 10 ? "0" : "" ) + seconds);
},1000);
setInterval( function() {
var minutes = new Date().getMinutes();
$("#min").html(( minutes < 10 ? "0" : "" ) + minutes);
},1000);
setInterval( function() {
var hours = new Date().getHours();
$("#hours").html(( hours < 10 ? "0" : "" ) + hours);
}, 1000);
});
</script>
</head>
<body>
<div class="clock">
<ul class="ys">
<li id="hours" class="ys2"> </li>
<li class="ys2" id="point">:</li>
<li class="ys2" id="min"> </li>
<li class="ys2" id="point">:</li>
<li class="ys2" id="sec"> </li>
</ul>
<div id="Date"></div>
</div>© 版权声明
本站收集的资源仅供内部学习研究软件设计思想和原理使用,学习研究后请自觉删除,请勿传播,因未及时删除所造成的任何后果责任自负。
如果用于其他用途,请购买正版支持作者,谢谢!若您认为「KKOK.CC」发布的内容若侵犯到您的权益,请联系站长邮箱:ezuw@qq.com 进行删除处理。
本站资源大多存储在云盘,如发现链接失效,请联系我们,我们会第一时间更新。相关文章
您必须登录才能参与评论!
立即登录




啥豪华