效果：

代码：

 <head runat="server">

     <title></title>

     <script type="text/javascript">

         function toDou(n) {

             if (n < 10) {

                 return '0' + n;

             }

             else {

                 return '' + n;

             }

         }

         setInterval(

         window.onload = function () {

             var aImg = document.getElementsByTagName('img');

             var oDate = new Date();

             var str = toDou(oDate.getHours()) + toDou(oDate.getMinutes()) + toDou(oDate.getSeconds());

             for (var i = 0; i < str.length; i++) {

                 aImg[i].src = 'Images/Number1/' + str[i] + '.jpg';

             }

         }, 1000);

     </script>

 </head>

 <body style="background-color: Black;">

     <div style="text-align: center; line-height: 600px">

         <img src="Images/Number1/0.jpg" /><img src="Images/Number1/0.jpg" /><span style="font-size: 77px;

             color: White; text-align: center; line-height: 2px;">:</span><img src="Images/Number1/0.jpg" /><img

                 src="Images/Number1/0.jpg" /><span style="font-size: 77px; color: White;">:</span><img

                     src="Images/Number1/0.jpg" /><img src="Images/Number1/0.jpg" />

     </div>

 </body>

点滴积累【JS】---JS小功能(setInterval实现图片效果显示时间)的更多相关文章

  1. JS类小功能

    工作中,总是要处理一些前端的小功能.都是网上搜的JS脚本 <script> //防止页面后退 history.pushState(null, null, document.URL); wi ...

  2. 点滴积累【JS】---JS小功能（JS实现模仿微博发布效果)

    效果: 思路: 利用多功能浮动运动框架实现微博效果,首先,将textarea中的属性添加到新创建的li里面然后,再将li添加到ul里面,再利用浮动运动框架将数据动态的显示出来. 代码: <hea ...

  3. 点滴积累【JS】---JS小功能（JS实现多功能缓冲运动框架)

    效果: 思路: 首先,多功能框架实现的功能是:css中所有的属性都可以添加进去(也可以把方法作为参数传递过去!),然后进行缓冲运动,比如:物体的高度.长度.颜色.字体大小.透明度等,都可以直接传入参数 ...

  4. 点滴积累【JS】---JS小功能（JS实现匀速运动）

    效果: 思路: 利用setInerval()计时器,进行运动.然后关键的一点是在最后停止的时候给它一个填充缝隙的判断. 代码: <head runat="server"> ...

  5. 点滴积累【JS】---JS小功能（JS实现动态添加运动属性)

    效果: 思路: 首先遍历div挨个执行onmouseover事件,再设置获取非行间样式.然后编写setInterval计时器框架,框架内容是:将三个参数 div.div属性.div的目标点,分别获得, ...

  6. 点滴积累【JS】---JS小功能（JS实现多物体缓冲运动)

    效果: 思路: 利用setInterval计时器进行运动,offsetWidth实现宽度的变动,在用onmouseover将终点和所选中的DIV放入参数再进行缓冲运动. 代码: <head ru ...

  7. 点滴积累【JS】---JS小功能（JS实现侧悬浮浮动)

    效果: 思路: 首先,加载onscroll控制滚动条.然后写缓存运动的方法,缓冲运动的方法是先计算出DIV缓冲的速度,并且将其取整,再进行运动判断什么时候到达终点.最后将其参数返回.再在onscrol ...

  8. 点滴积累【JS】---JS小功能（JS实现隐藏显示侧边栏，也就是分享栏的隐藏显示）

    效果: 思路: 首先,利用计时器setInterval实现DIV的隐藏显示功能,然后在进行一个判断,之后在把要移动的相应距离进行一个参数传递,再根据参数判断出移动的方向也就是offsetLeft移动的 ...

  9. 点滴积累【JS】---JS小功能(offsetLeft实现图片滚动效果）

    效果: 代码: <head runat="server"> <title></title> <style type="text/ ...

随机推荐

  1. opensuse搜狐镜像

    openSUSE-13.1-Update-sohu-mirror http://mirrors.sohu.com/opensuse/update/13.1/ openSUSE-13.1-Oss-soh ...

  2. HDU 4633 Who's Aunt Zhang （2013多校4 1002 polya计数）

    Who's Aunt Zhang Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) ...

  3. [Apache手册]Linux环境下配置Apache运行cgi

    CGI动态页面 相关模块 相关指令 mod_alias mod_cgi AddHandler Options ScriptAlias CGI(公共网关接口)定义了web服务器与外部内容生成程序之间交互 ...

  4. webpack与browser-sync热更新原理深度讲解

    本文首发于CSDN网站,下面的版本又经过进一步的修订.原文:webpack与browser-sync热更新原理深度讲解本文包含如下内容: webpack-hot-middleware EventSou ...

  5. 面试DB优化

    高频全表扫描 0.5 表大小超过200M,且SQL高频执行(15分钟内超过500次),PIR 3级,表大小超过高速缓存的1.5%,报PIR 2级. 禁止使用select * 0.5 禁止使用selec ...

  6. Oracle数据库中的所有用户名

    select * from dba_users; 查看数据库里面所有用户,前提是你是有dba权限的帐号,如sys,systemselect * from all_users;  查看你能管理的所有用户 ...

  7. sql语句 -- 倒序 升序

  8. Google Chrome插件开发-Context Menus

    本节主要介绍如何在Google Chrome浏览器web页面上点击右键弹出自定义菜单,即如何使用谷歌Context Menus API接口.上节已经把主要流程介绍了,这节就直接上代码,代码都是官方例子 ...

  9. java 实现poi方式读取word文件内容

    1.下载poi的jar包 下载地址:https://www.apache.org/dyn/closer.lua/poi/release/bin/poi-bin-3.17-20170915.tar.gz ...

  10. Win7如何开机直接进桌面

    运行CONTROL USERPASSWORDS2 取消登陆要密码那项后再点应用,直接输入密码下次就能自己登陆进入桌面啦