JavaScript简单的实例应用
1、显示当前时间:
<!doctype>
<html>
<head>
<meta charset='utf-8'>
<script type='text/javascript'>
function showtime(){
var now_time = new date(); //创建时间对象的实例
var hours = now_time.gethours(); //获得当前小时数
var minutes = now_time.getminutes(); //获得当前分钟数
var seconds = now_time.getseconds(); //获得当前秒数
var timer = "" + ((hours > 12) ? hours - 12 : hours);
timer += ((minutes < 10) ? ":0" : ":") + minutes;
timer += ((seconds < 10) ? ":0" : ":") + seconds;
timer += " " + ((hours > 12) ? "pm" : "am");
document.getElementById("aa").text = timer;
settimeout('showtime()', 1000);
}
</script>
</head>
<body onload="showtime()">
<div id="aa"></div>
</body>
</html>
2、当鼠标经过图像时图像的震动效果:
<!doctype>
<html>
<head>
<meta charset='utf-8'>
<script type='text/javascript'>
var rector = 3, stopit = 0, a = 1;
function init(which){
stopit = 0;
zhend = which;
zhend.style.left = 0;
zhend.style.top = 0;
}
function rattleimage(which){
if((!document.all && !document.getElementById) || stopit = 1)
return;
if(a == 1){
zhend.style.top = parseInt(zhend.style.top) + rector;
} else if(a == 2){
zhend.style.left = parseInt(zhend.style.left) + rector;
} else if(a == 3){
zhend.style.top = parseInt(zhend.style.top) - rector;
} else if(a == 4){
zhend.style.left = parseInt(zhend.style.left) - rector;
}
else {
zhend.style.left = parseInt(zhend.style.left) - rector;
}
if(a < 4)
a++;
else
a = 1;
settimeout('rattleimage()', 50);
}
function stoprattle(which){
stopit = 1;
which.style.left = 0;
which.style.left = 0;
}
</script>
</head>
<body>
<img src="test.png" class="zhendimage" onMouseover="init(this);rattleimage()" onmoouseout="stoprattle(this)" />
</body>
</html>
3、自由切换图像:
<!doctype>
<html>
<head>
<meta charset='utf-8'>
<script type='text/javascript'>
var img = new array(3);
var nums = 0;
if(document.images){
for(i = 1; i <= 3; i ++){
img[i] = new image();
img[i].src = 'images/00' + i + '.png';
}
}
function fort(){
nums ++;
document.images[0].src = img[nums].src;
if(nums == 3)
nums = 0;
}
function slide(){
setInterval('fort()', 1000);
}
</script>
</head>
<body onload="slide()"> </body>
</html>
JavaScript简单的实例应用的更多相关文章
- Javascript DOM操作实例
最近在学DOM,但是还是没有办法很好的记住API,想找些例子来练习,网上的例子将一个个DOM对象方法挨个举例,并没有集合在一起用,效果不尽人意.所以自己写一份实例,顺便巩固下学到的知识. ...
- Google Map JavaScript API V3 实例大全
Google Map JavaScript API V3 实例大全 基础知识 简单的例子 地理位置 语言 位置 坐标 简单的投影 事件 简单事件 关闭事件 多次添加事件 事件属性 控制 php禁用ui ...
- 原生Ajax用法——一个简单的实例
Ajax全名(Asynchronous(异步) JavaScript and XML )是可以实现局部刷新的 在讲AJax之前我们先用简单的实例说一下同步和异步这个概念 /*异步的概念(就是当领导有一 ...
- 纯JSP简单登录实例
记一下,免得以后忘记了,又要去查. 文件共有四个web.xml.login.jsp.logout.jsp.welcome.jsp四个文件 测试环境:Tomcat 6.0.x 假设项目名称是LoginS ...
- ASP.NET MVC 4 插件化架构简单实现-实例篇
先回顾一下上篇决定的做法: 1.定义程序集搜索目录(临时目录). 2.将要使用的各种程序集(插件)复制到该目录. 3.加载临时目录中的程序集. 4.定义模板引擎的搜索路径. 5.在模板引擎的查找页面方 ...
- Linux简单程序实例(GNU工具链,进程,线程,无名管道pipe,基于fd的文件操作,信号,scoket)
一, GNU工具链简介: (1)编译代码步骤: 预处理 -> 编译 -> 汇编 -> 链接: 预处理:去掉注释,进行宏替换,头文件包含等工作: gcc -E test.c -o te ...
- Redis:安装、配置、操作和简单代码实例(C语言Client端)
Redis:安装.配置.操作和简单代码实例(C语言Client端) - hj19870806的专栏 - 博客频道 - CSDN.NET Redis:安装.配置.操作和简单代码实例(C语言Client端 ...
- MVC 4 插件化架构简单实现实例篇
ASP.NET MVC 4 插件化架构简单实现-实例篇 先回顾一下上篇决定的做法: 1.定义程序集搜索目录(临时目录). 2.将要使用的各种程序集(插件)复制到该目录. 3.加载临时目录中的程序集 ...
- 分布式搜索ElasticSearch构建集群与简单搜索实例应用
分布式搜索ElasticSearch构建集群与简单搜索实例应用 关于ElasticSearch不介绍了,直接说应用. 分布式ElasticSearch集群构建的方法. 1.通过在程序中创建一个嵌入es ...
随机推荐
- xlsx 库 知识点
官方github地址:https://github.com/SheetJS/js-xlsx xlsx 用webpack打包后体积太大: vue-cli构建的项目,优化办法:https://segmen ...
- a标签打开设置
<a href="http://www.baidu.com" target="_Blank">百度</a> _Blank是新窗口_Sel ...
- 亿级用户百TB级数据的AIOps 技术实践之路
关于面临的挑战 "因为专业性强,我认为反而让交互方式变简单了,打个点餐的比方,软件1.0阶段是,我要吃鱼香肉丝,我要吃辣的或是素一点的,根据清晰的接口上菜.而软件2.0阶段就是,我今天想吃开 ...
- EXT4 超级块介绍(转)
https://blog.csdn.net/sunlei0625/article/details/79011946 The superblock records various information ...
- C# 值类型
sbyte:表示-128~127之间的整数. byte:表示0~255之间的整数. short(Int16):-32768~32767之间的整数. ushort:在0~65535之间的整数. int( ...
- subversion与TortoiseSVN的使用
Subversion是一个自由开源的版本控制系统.在Subversion管理下,文件和目录可以超越时空.Subversion将文件存放在中心版本库里,这个版本库很像一个普通的文件服务器,不同的是,它可 ...
- 让邮件服务器发出的Email不被认为是垃圾邮件
配置一个Email服务器很简单,用Postfix等软件稍微配置一下就可以了,几分钟搞定. 但Email服务器发出去的Email很可能经常被人当成垃圾邮件,怎么配置Email服务器才能让Email服务器 ...
- 优化sql用到的方法
set statistics profile on set statistics io on set statistics time on declare @begin_date datetime d ...
- Windows 2003 下安装 SQL Server 2008 Express
.NET Framework 3.5 Service Pack 1(完整程序包) https://www.microsoft.com/zh-cn/download/details.aspx?id=25 ...
- ALGO-22_蓝桥杯_算法训练_装箱问题(DP)
问题描述 有一个箱子容量为V(正整数,<=V<=),同时有n个物品(<n<=),每个物品有一个体积(正整数). 要求n个物品中,任取若干个装入箱内,使箱子的剩余空间为最小. 输 ...