js-图片时间困难版(倒计时)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p></p>
<div></div>
<script>
var oP = document.getElementsByTagName("p")[0]
var oImg = document.getElementsByTagName("img")
var oDiv = document.getElementsByTagName("div")[0]
var arr = ["img/0.JPG","img/1.JPG","img/2.JPG","img/3.JPG","img/4.JPG","img/5.JPG","img/6.JPG","img/7.JPG","img/8.JPG","img/9.JPG"]
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
return str
}
setInterval(function(){
time()
},1000)
var str = time()
var str1 = ""
for (var i=0;i<str.length;i++) {
str1+="<img/>"
}
oDiv.innerHTML = str1
function run(){
var str = time()
for (var i=0;i<str.length;i++) {
oImg[i].src = arr[str.charAt(i)]
}
}
run()
setInterval(function(){
run()
},1000)
function add(str){
return str>9?str:"0"+str
}
</script>
</body>
</html>
js-图片时间困难版(倒计时)的更多相关文章
- js图片时间和倒计时
图片时间原理 原理:使用定时器每秒获取时间,获取时间的时,分,秒,组成一个6位数的字符串,然后用charAt,截取出对应的字符,图片命名和数字相对应就ok拉 倒计时原理 原 ...
- js图片时间翻转
带素材 代码一: <!-- Author: XiaoWen Create a file: 2016-12-12 10:08:02 Last modified: 2016-12-12 11:30: ...
- 原生js 当前时间 倒计时代码
源:https://www.oschina.net/code/snippet_2318153_54763 <!DOCTYPE html> <html> <head> ...
- js 图片轮播简单版
<html> <head> <meta charset="utf-8" /> <title></title> <s ...
- javascript小技巧:同步服务器时间、同步倒计时
之前在网上看到有人提问,如何在页面上同步显示服务器的时间,其实实现方法有几种,可能一般人立马就想到可以使用Ajax每隔一秒去请求服务器,然后将服务器获取到时间显示在页面上,这样虽然能够实现,但存在一个 ...
- JS图片延迟加载分析及简单的demo
JS图片延迟加载 图片延迟加载也称 "懒加载",通常应用于图片比较多的网页,比如 "美丽说首页","蘑菇街"等一些导购网站上用的比较多,或者 ...
- JS图片自动或者手动滚动效果(支持left或者up)
JS图片自动或者手动滚动效果(支持left或者up) JS图片自动或者手动滚动效果 在谈组件之前 来谈谈今天遇到搞笑的事情,今天上午接到一个杭州电话 0571-28001187 即说是杭州人民法院的 ...
- ImageDrawer.js图片绘制插件
ImageDrawer.js图片绘制插件有以下一些可用的配置参数. Duration:整个动画或每个步骤的绘制时间(以秒为单位) Background:在绘图时将颜色放在图片上 Callback:绘画 ...
- 项目总结07:JS图片的上传预览和表单提交(FileReader()方法)
JS图片的上传预览和表单提交(FileReader()方法) 一开始没有搞明白下面这块代码的,今天有时间简单整理下 核心点:FileReader()方法 以下是代码(以JSP文件为例) <!DO ...
随机推荐
- memcached 一致性hash原理
memcache 是一个分布式的缓存系统,但是本身没有提供集群功能,在大型应用的情况下容易成为瓶颈.但是客户端这个时候可以自由扩展,分两阶段实现.第一阶段:key 要先根据一定的算法映射到一台memc ...
- sqli盲注自用脚本
盲注脚本 # -*- coding:utf-8 -*- import requests import re url = "http://123.206.87.240:8002/chengji ...
- keepalived+nginx+tomcat+redis集群环境部署
1.所需软件.jar包.配置文件下载:http://pan.baidu.com/s/1dFgntst 2.环境说明: centos6.5 64位 主节点:192.168.40.121 副节点:192 ...
- JS下拉页面时一个横幅的样式和js
整理之前的代码,发现有一个js,就是页面往下浏览时,上面的商品名称和购买按钮在页面上方悬浮的,就整理下来,代码如下: <script type="text/javascript&quo ...
- Notepad++ tab替换为4个空格
- 斐波那契数列(NOIP1997)
题目链接:斐波那契数列 这题是数论的一个基本应用,还是很水,因为数据范围太水了,只有48,这也太小了.不过也有可能是当时的电脑速度跑得比较慢的原因.但是这个算法应该还是这个算法.主要思路就是递推求斐波 ...
- python学习 day11 (3月16日)----(生成器内置函数)
1生成器 1生成器的本质 一定是迭代器(反之不一定(用send(生成器特有方法)验证))2生成器是可以让程序员自己定义的一个迭代器3生成器的好处,节省内存空间4生成器的特性,一次性的,惰性机制,从上往 ...
- ubuntu安装rubyOnRails
https://gorails.com/setup/ubuntu/16.04#ruby-rbenv 文章很详细
- [转]order by 与索引
ORDER BY 通常会有两种实现方法,一个是利用有序索引自动实现,也就是说利用有序索引的有序性就不再另做排序操作了.另一个是把结果选好之后再排序. 用有序索引这种,当然是最快的,不过有一些限制条件, ...
- swift -基础语法
/** * 1.变量 */ let count1 = 11; print(count1); var count ...