javascript实现点击延迟的小程序
<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">
<title></title>
<style>
div{
float: left;
margin: 10px;
}
#div1{
width: 50px;
height: 50px;
background: red;
}
#div2{
width: 180px;
height: 100px;
background: #ccc;
display: none;
}
</style>
<script>
window.onload = function(){
var oDiv1 = document.getElementById('div1');
var oDiv2 = document.getElementById('div2');
var timer = null;
oDiv1.onmouseover=oDiv2.onmouseover=function(){
clearTimeout(timer);
oDiv2.style.display = 'block';
}
oDiv1.onmouseout =oDiv2.onmouseout = function(){
timer = setTimeout(function(){
oDiv2.style.display = 'none';
},500);
}
}
</script>
</head>
<body>
<div id="div1"></div>
<div id="div2"></div>
</body>
</html>
时钟的小程序
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
function toDou(n){
if(n<10){
return '0' +n;
}else
{
return ''+n;
}
}
window.onload = function(){
var aImg = document.getElementsByTagName('img');
setInterval(function(){
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 = 'img/'+str[i]+'.jpg';
}
},1000)
}
</script>
</head>
<body>
:
:
</body>
</html>
