js--时钟(图片)
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="index" content="时钟"/>
<title>时钟</title>
<style type="text/css">
body,div,img{padding:0; margin:0;}
#box{
width:530px;
height:93px;
margin:200px auto;
}
img{
width:60px;
height:93px;
border:none;
} </style>
<script type="text/javascript" src="index.js"></script>
</head>
<body>
<div id="box">
<img src="./images/0.png"/>
<img src="./images/0.png"/>
<img src="./images/0.png"/>
<img src="./images/0.png"/>
<img src="./images/0.png"/>
<img src="./images/0.png"/>
</div>
<script type="text/javascript">
function toDou(n){
if(n<10){
return '0'+n;
}
else{
return ''+n;
}
}
window.onload=function(){
var aImg=document.getElementsByTagName('img');
function tick(){
var oDate=new Date();
var str=toDou(oDate.getHours())+toDou(oDate.getMinutes())+toDou(oDate.getSeconds()); for(var i=0; i<aImg.length; i++){
aImg[i].src='./images/'+str.charAt(i)+'.png';
}
}
setInterval(tick, 1000);
tick();
}; </script>
</body>
</html>
2.同一页面多个时钟(非图片,见360云盘)
js--时钟(图片)的更多相关文章
- js简单 图片版时钟,带翻转效果
js简单 图片版时钟,带翻转效果 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
- JS实现图片预加载无需等待
网站开发时经常需要在某个页面需要实现对大量图片的浏览;用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...
- js压缩图片base64长度
var myCanvas=$('.img-container > img').cropper('getCroppedCanvas'); (function (base64){ var image ...
- ASP.NET MVC中使用Dropzone.js实现图片的批量拖拽上传
说在前面 最近在做一个MVC相册的网站(这里),需要批量上传照片功能,所以就在网上搜相关的插件,偶然机会发现Dropzone.js,试用了一下完全符合我的要求,而且样式挺满意的,于是就在我的项目中使用 ...
- 使用 FocusPoint.js 实现图片的响应式裁剪
通常网站的布局都不是单一的.例如图像在电脑.平板和智能手机上可能显示的形状是不同的.特别是如果你使用的是全屏图像,在你必须使用相同的图像文件的情况下,你的主题可能会被截断或完全缺失,或者看起来很尴尬. ...
- Lazyr.js – 延迟加载图片(Lazy Loading)
Lazyr.js 是一个小的.快速的.现代的.相互间无依赖的图片延迟加载库.通过延迟加载图片,让图片出现在(或接近))视窗才加载来提高页面打开速度.这个库通过保持最少选项并最大化速度. 在线演示 ...
- Webview加载本地js、图片的方法
在项目开发中经常会将比较大的js.图片.css等放到app中,而html放服务器,这样在使用时流量较少,加载也比都放服务器上快,其实方法也比较多,网上搜了很久都没结果. 一种是获取服务器返回的html ...
- WebApp:如何让安卓的webview缓存webapp的html、js和图片等资源
一.开发环境 客户端:安卓+webview(vuejs) 服务器端:tomcat 8.0 二.问题 使用安卓原生+web(基于webpack+vuejs)的方式开发了一个安卓应 ...
- lazyload.js实现图片异步载入
所谓图片异步加载,意思是不用一次把图片全部加载完,你可以叫它延迟加载,缓冲加载都行. 看看你有没有这种需求:某篇文章图片很多,如果在载入文章时就载入所有图片,无疑会延缓载入速度,让用户等更久,所以,我 ...
- js判断图片加载完成后获取图片实际宽高
通常,我们会用jq的.width()/.height()方法获取图片的宽度/高度或者用js的.offsetwidth/.offsetheight方法来获取图片的宽度/高度,但这些方法在我们通过样式设置 ...
随机推荐
- HTML5的文档结构
HTML5的文档结构 HTML5简化了许多,它的设计遵循了3个原则:1.兼容性.2.实用性.3.通用访问性 1. header 元素 <header> 标签定义文档或者文档 ...
- __import__简介
__import__() import 语句通过调用__import__()来完成工作,提供这个函数是为了让有特殊需要的用户覆盖他,实现自定义.__import__最大的好处就是可以使程序在r ...
- Python 的基本使用说明
1.先定义一个被调用的模块,文件名 cnf.py #!/usr/bin/ #coding=utf- import sys reload(sys) sys.setdefaultencoding( &qu ...
- 利用DataSet更改数据,将更改保存到数据库中
RowState 是 DataRow 很重要的一个属性, 表示 DataRow 当前的状态. RowState 有 Added, Modified, Unchanged, Deleted, Detac ...
- FTP上传下载工具(FlashFXP) v5.5.0 中文版
软件名称: FTP上传下载工具(FlashFXP) 软件语言: 简体中文 授权方式: 免费试用 运行环境: Win 32位/64位 软件大小: 7.4MB 图片预览: 软件简介: FlashFXP 是 ...
- Attempt to write to field 'android.support.v4.app.FragmentManagerImpl android.support.v4.app.Fragment.mFragmentManager' on a null object reference
E/AndroidRuntime﹕ FATAL EXCEPTION: mainProcess: org.example.magnusluca.drawertestapp, PID: 3624java. ...
- openstack私有云布署实践【11.3 计算nova - compute节点-nova用户免密登录(用于云主机冷迁移+扩展云主机大小)】
云主机迁移+扩展云主机大小 ,官方说它依赖nova用户之间的免密登录.确保每个resion区域的compute节点服务器他们可以相互SSH免密 compute1-7 他们相互SSH免密 k ...
- python绝技 — 用Scapy解析TTL字段的值
#!/usr/bin/env python #--*--coding=utf-8--*-- #打印收到的数据包的源IP和TTL值 from scapy.all import * def testTTL ...
- html-----vedio标签(HTML5新标签VIDEO在IOS上默认全屏播放)
今天做一个app时发现一个问题,应用html5中的video标签加载视频,在Android手机上默认播放大小,但是换成iPhone手机上出问题了,默认弹出全屏播放,查找了好多论坛,都没有谈论这个的.然 ...
- 一个view相对于屏幕或者另外一个view 的坐标
如果想知道一个view相对于屏幕或者另外一个view 的坐标,那么可以通过如下的方法得到: UIWindow * window=[[[UIApplication sharedApplication] ...