点滴积累【JS】---JS小功能(setInterval实现图片效果显示时间)
效果:

代码:
<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实现图片效果显示时间)的更多相关文章
- JS类小功能
工作中,总是要处理一些前端的小功能.都是网上搜的JS脚本 <script> //防止页面后退 history.pushState(null, null, document.URL); wi ...
- 点滴积累【JS】---JS小功能(JS实现模仿微博发布效果)
效果: 思路: 利用多功能浮动运动框架实现微博效果,首先,将textarea中的属性添加到新创建的li里面然后,再将li添加到ul里面,再利用浮动运动框架将数据动态的显示出来. 代码: <hea ...
- 点滴积累【JS】---JS小功能(JS实现多功能缓冲运动框架)
效果: 思路: 首先,多功能框架实现的功能是:css中所有的属性都可以添加进去(也可以把方法作为参数传递过去!),然后进行缓冲运动,比如:物体的高度.长度.颜色.字体大小.透明度等,都可以直接传入参数 ...
- 点滴积累【JS】---JS小功能(JS实现匀速运动)
效果: 思路: 利用setInerval()计时器,进行运动.然后关键的一点是在最后停止的时候给它一个填充缝隙的判断. 代码: <head runat="server"> ...
- 点滴积累【JS】---JS小功能(JS实现动态添加运动属性)
效果: 思路: 首先遍历div挨个执行onmouseover事件,再设置获取非行间样式.然后编写setInterval计时器框架,框架内容是:将三个参数 div.div属性.div的目标点,分别获得, ...
- 点滴积累【JS】---JS小功能(JS实现多物体缓冲运动)
效果: 思路: 利用setInterval计时器进行运动,offsetWidth实现宽度的变动,在用onmouseover将终点和所选中的DIV放入参数再进行缓冲运动. 代码: <head ru ...
- 点滴积累【JS】---JS小功能(JS实现侧悬浮浮动)
效果: 思路: 首先,加载onscroll控制滚动条.然后写缓存运动的方法,缓冲运动的方法是先计算出DIV缓冲的速度,并且将其取整,再进行运动判断什么时候到达终点.最后将其参数返回.再在onscrol ...
- 点滴积累【JS】---JS小功能(JS实现隐藏显示侧边栏,也就是分享栏的隐藏显示)
效果: 思路: 首先,利用计时器setInterval实现DIV的隐藏显示功能,然后在进行一个判断,之后在把要移动的相应距离进行一个参数传递,再根据参数判断出移动的方向也就是offsetLeft移动的 ...
- 点滴积累【JS】---JS小功能(offsetLeft实现图片滚动效果)
效果: 代码: <head runat="server"> <title></title> <style type="text/ ...
随机推荐
- Laravel简⃣单⃣的⃣路⃣由⃣
在⃣routes.php文⃣件⃣中⃣写⃣如⃣下⃣几⃣个⃣函⃣数⃣: Route::get('/', function () { return view('welcome'); }); // 获⃣取⃣a ...
- [Android Memory] Linux下malloc函数和OOM Killer
http://www.linuxidc.com/Linux/2010-09/28364.htm Linux下malloc函数主要用来在用户空间从heap申请内存,申请成功返回指向所分配内存的指针,申请 ...
- iOS:iOS开发系列–打造自己的“美图秀秀”(中)
来源: KenshinCui 链接:http://www.cnblogs.com/kenshincui/p/3959951.html 其他状态设置 常用的图形上下文状态设置上面基本都用到了,我们不再一 ...
- JStorm模型设计
问题描述 1.在流式计算中经常需要对一批的数据进行汇总计算,类似SQL中的GROUP BY.在用JStorm来实现这一条简单的SQL时,面对的是一条一条的数据库变化的消息(这里需要保证有序消费),其实 ...
- Python绘制直方图 Pygal模拟掷骰子
#coding=utf-8 from random import randint class Die(): """骰子类""" def __ ...
- [Angular] Introduction to Angular Internationalization (i18n)
To add translation to the application: <button (click)="onEditCourse()" i18n>Edit bu ...
- [Angular] Extract Implementation Details of ngrx from an Angular Application with the Facade Pattern
Extracting away the implementation details of ngrx from your components using the facade pattern cre ...
- http_load压力测试使用
介绍:http_load以并行复用的方式运行,用以测试web服务器的吞吐量与负载.但是它不同于大多数压力测试工具,它可以以一个单一的进程运行,一般不会把客户机搞死.还可以测试HTTPS类的网站请求. ...
- minic 符号表
#include <stdio.h> #include <string.h> #include <malloc.h> typedef struct _array_d ...
- 利用JMX来监控大部分java应用
JMX(JavaManagement Extensions,即Java管理扩展)是一个为应用程序.设备.系统等植入管理功能的框架.JMX可以跨越一系列异构操作系统平台.系统体系结构和网络传输协议,灵活 ...