点滴积累【JS】---JS小功能(setInterval实现图片效果显示时间)

最新推荐文章于 2023-06-14 21:13:56 发布

weixin_34040079

最新推荐文章于 2023-06-14 21:13:56 发布

阅读量93

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/xinchun/p/3443626.html

版权

效果：

代码：

 1 <head runat="server">
 2     <title></title>
 3     <script type="text/javascript">
 4         function toDou(n) {
 5             if (n < 10) {
 6                 return '0' + n;
 7             }
 8             else {
 9                 return '' + n;
10             }
11         }
12         setInterval(
13         window.onload = function () {
14             var aImg = document.getElementsByTagName('img');
15             var oDate = new Date();
16             var str = toDou(oDate.getHours()) + toDou(oDate.getMinutes()) + toDou(oDate.getSeconds());
17             for (var i = 0; i < str.length; i++) {
18                 aImg[i].src = 'Images/Number1/' + str[i] + '.jpg';
19             }
20         }, 1000);
21 
22     </script>
23 </head>
24 <body style="background-color: Black;">
25     <div style="text-align: center; line-height: 600px">
26         <img src="Images/Number1/0.jpg" /><img src="Images/Number1/0.jpg" /><span style="font-size: 77px;
27             color: White; text-align: center; line-height: 2px;">:</span><img src="Images/Number1/0.jpg" /><img
28                 src="Images/Number1/0.jpg" /><span style="font-size: 77px; color: White;">:</span><img
29                     src="Images/Number1/0.jpg" /><img src="Images/Number1/0.jpg" />
30     </div>
31 </body>

转载于:https://www.cnblogs.com/xinchun/p/3443626.html

weixin_34040079

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
点滴积累【JS】---JS小功能(setInterval实现图片效果显示时间)

效果：代码： 1 <head runat="server"> 2 <title></title> 3 <script type="text/javascript"> 4 function toDou(n) { 5 if (n < 10) { 6 ...
复制链接

扫一扫