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>