<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <p></p>
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        
        
        
        <script>
            var oP = document.getElementsByTagName("p")[0]
            var oImg = document.getElementsByTagName("img")
            
            
                
                function time(){
                    var now = new Date()
                    var oHours = now.getHours()
                    var oMin = now.getMinutes()
                    var oSec = now.getSeconds()
                    var str = add(oHours)+""+add(oMin)+""+add(oSec)
                    oP.innerHTML = str
                    for (var i=0;i<str.length;i++) {
                        oImg[i].src = "img/"+str.charAt(i)+".JPG"
                    }
                }
                time()
                
                setInterval(function(){
                    time()
                },1000)
                
            
            function add(str){
                return str>9?str:"0"+str
            }
        </script>
    </body>
</html>

js-图片时间(倒计时)的更多相关文章

  1. 原生js 当前时间 倒计时代码

    源:https://www.oschina.net/code/snippet_2318153_54763 <!DOCTYPE html> <html> <head> ...

  2. js图片时间和倒计时

    图片时间原理        原理:使用定时器每秒获取时间,获取时间的时,分,秒,组成一个6位数的字符串,然后用charAt,截取出对应的字符,图片命名和数字相对应就ok拉 倒计时原理        原 ...

  3. js图片时间翻转

    带素材 代码一: <!-- Author: XiaoWen Create a file: 2016-12-12 10:08:02 Last modified: 2016-12-12 11:30: ...

  4. js时间倒计时

    看了网上的其他的例子,觉得写的都有点复杂,不好理解,于是自己动手写了个. 本来想封装成jquery插件,但是觉得因为功能很简单,没有必要做成jquery插件,引用的时候不需要引入jqery库,这里直接 ...

  5. php和js一起实现倒计时功能

    里获取的php服务端的时间 纯JS是获取客服端时间! <?php //php的时间是以秒算.js的时间以毫秒算 date_default_timezone_set('PRC'); //date_ ...

  6. JS图片延迟加载分析及简单的demo

    JS图片延迟加载 图片延迟加载也称 "懒加载",通常应用于图片比较多的网页,比如 "美丽说首页","蘑菇街"等一些导购网站上用的比较多,或者 ...

  7. JS图片自动或者手动滚动效果(支持left或者up)

    JS图片自动或者手动滚动效果(支持left或者up) JS图片自动或者手动滚动效果 在谈组件之前 来谈谈今天遇到搞笑的事情,今天上午接到一个杭州电话 0571-28001187 即说是杭州人民法院的 ...

  8. ImageDrawer.js图片绘制插件

    ImageDrawer.js图片绘制插件有以下一些可用的配置参数. Duration:整个动画或每个步骤的绘制时间(以秒为单位) Background:在绘图时将颜色放在图片上 Callback:绘画 ...

  9. 项目总结07：JS图片的上传预览和表单提交（FileReader()方法）

    JS图片的上传预览和表单提交(FileReader()方法) 一开始没有搞明白下面这块代码的,今天有时间简单整理下 核心点:FileReader()方法 以下是代码(以JSP文件为例) <!DO ...

  10. JS图片Switchable切换大集合

    JS图片切换大集合 利用周末2天把JS图片切换常见效果封装了下,比如:轮播,显示隐藏,淡入淡出等.废话不多说,直接看效果吧!JSFiddler链接如下: 想看JS轮播切换效果请点击我! 当然由于上传图 ...

随机推荐

  1. PAT 1018 锤子剪刀布（20）

    1018 锤子剪刀布 (20)(20 分) 大家应该都会玩"锤子剪刀布"的游戏:两人同时给出手势,胜负规则如图所示: 现给出两人的交锋记录,请统计双方的胜.平.负次数,并且给出双方 ...

  2. andorid 对话框

    activity_ui2.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout x ...

  3. Android.Tools.Eclipse hangs at the Android SDK Content Loader

    Eclipse hangs at the Android SDK Content Loader http://stackoverflow.com/questions/13489141/eclipse- ...

  4. web框架--MVC、MTV

    一.MVC框架: MVC 是一种使用 MVC(Model View Controller 模型-视图-控制器)设计创建 Web 应用程序的模式:[1] Model(模型)表示应用程序核心(比如数据库记 ...

  5. CH#17C 舞动的夜晚

    原题链接 即求二分图的不可行边数量,因为不保证是完备匹配,所以需要通过网络流求出任意一组最大匹配,并建立新图判断. 建新图:对于跑完网络流的图上已经匹配的边,建立反边:对于没有匹配的边,建立正边(图只 ...

  6. CH6202 黑暗城堡

    一道最短路+生成树 原题链接 实际上就是生成树的中每个点到节点\(1\)的距离等于原图中这个点到节点\(1\)的最短距离,求这样的生成树的棵数. 先用\(SPFA\)或\(Dijkstra\)求出所有 ...

  7. Expressions入门示例

    学习表达式的入门例子,前提是要对委托有一定的了解,泛型明白一些.using System; using System.Linq; using System.Linq.Expressions; usin ...

  8. keepalived+nginx+tomcat+redis集群环境部署

    1.所需软件.jar包.配置文件下载:http://pan.baidu.com/s/1dFgntst 2.环境说明: centos6.5  64位 主节点:192.168.40.121 副节点:192 ...

  9. luaFramework

    BeginStaticLibs  参考CustomSettings.cs public static List<Type> staticClassTypes = new List<T ...

  10. IO之4种字节流拷贝文件方式对比

    public class CopyMp4Demo { public static void main(String[] args) throws IOException { long start = ...