<!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. andorid 对话框

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

  2. IDEA工具 常用的设置

    以下均为笔者常用的的设置. 首先选择菜单栏的选项:“File” ----> “settings” 1.字体设置 (1)代码区的字体设置 如下图的选择,"Primary font&quo ...

  3. 零基础照样做RNA-seq差异分析

    零基础照样做RNA-seq差异分析 GCBI知识库2018-08-24 14:43:36 基因表达谱的差异分析是RNA-seq中最常见的应用.你眼中的RNA-seq差异分析或许是酱紫的,对不会编程,不 ...

  4. Java中终止线程的三种方法

    终止线程一般建议采用的方法是让线程自行结束,进入Dead(死亡)状态,就是执行完run()方法.即如果想要停止一个线程的执行,就要提供某种方式让线程能够自动结束run()方法的执行.比如设置一个标志来 ...

  5. 拼图类APP原型模板分享——简拼

    简拼是一款记录美好.抒写情怀的拼图APP,模板设计风格简约文艺,种类齐全. 此原型模板所用到的组件有标签组.水平分隔线.圆形工具.交互动作有结合标签组实现页面跳转,选择组件触发按钮状态变化等. 此原型 ...

  6. 动态代理jdk和cglib的区别

    学习来源贴:http://www.cnblogs.com/jqyp/archive/2010/08/20/1805041.html JDK实现动态代理需要实现类通过接口定义业务方法,对于没有接口的类, ...

  7. 进度条的制作unity

    不说了直接上代码: LoadingPanel: using UnityEngine;using System.Collections;using UnityEngine.UI;using UnityE ...

  8. 860. Lemonade Change

    class Solution { public: bool lemonadeChange(vector<int>& bills) { , ten = ; for (int i : ...

  9. 2019.01.23 ural1519 Formula 1（轮廓线dp）

    传送门 轮廓线dpdpdp模板题. 题意简述:给一个放有障碍的网格图,问有多少种方法能使所有非障碍格子都在同一条哈密顿回路上面. 考虑用括号序列的写法来状压这个轮廓线. 用000表示没有插头,111表 ...

  10. 2018.12.30 bzoj3027: [Ceoi2004]Sweet（生成函数+搜索）

    传送门 生成函数好题. 题意简述:给出n个盒子,第iii个盒子里有mim_imi​颗相同的糖(但不同盒子中的糖不相同),问有多少种选法可以从各盒子中选出数量在[a,b][a,b][a,b]之间的糖果. ...