<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>Insert title here</title>
<script>
function toDou(n)
{
if (n<10) {
return '0'+n;
}
else {
return ''+n;
}
}
window.οnlοad= 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)+'.jpg';
};
};
setInterval(tick,1000);
tick();
};
window.onload = function(){
var oDiv1 = document.getElementById('div1');
var oDiv2 = document.getElementById('div2');
var timer=null;
oDiv1.onmouseover = function(){
clearTimeout(timer);
oDiv2.style.display='block';
};
oDiv1.onmouseout = function(){
timer=setTimeout(function(){
oDiv2.style.display='none';
},500);
};
oDiv2.οnmοuseοver= function(){
clearTimeout(timer);
};
oDiv2.οnmοuseοut= function(){
timer= clearTimeout(function(){
oDiv2.style.display='none';},500);
}
};
</script>
<style>
div{ float:left; margin:10px}
#div1{ height:50px; width:50px; background:red;}
#div2{ height:250px; width:250px; background:#ccc; display:none;}
</style>
</head>
<body style="background:black; color:white; font-size:70px; text-align:center;">
<img src="images/0.jpg"/>
<img src="images/0.jpg"/>
:
<img src="images/0.jpg"/>
<img src="images/0.jpg"/>
:
<img src="images/0.jpg"/>
<img src="images/0.jpg"/>
<p style="font-size:30px;">
2013年5月17日 星期日
</p>
<div id="div1"></div>
<div id="div2"></div>
</body>
</html>
|
转载于:https://my.oschina.net/u/990389/blog/131599