<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title>黑色头发</title>
<style type="text/css">
body {
margin:0px;
}
#but {
position:relative;
}
#but_temp {
background:#f3f3f3;
border:1px solid #ccc;
font-size:12px;
position:absolute;
padding:10px;
overflow:hidden;
display:none;
}
</style>
</head>
<body>
<table width='100%'>
<tr>
<td width='200'> </td><td><img src='http://images.51job.com/im/images/select.gif' id='but' /></td>
</tr>
</table>
<div id='but_temp'><a href='http://heisetoufa.iteye.com'>黑色头发</a><img src='http://hao123.com/logox3.gif' /></div>
<script type="text/javascript">
function $(o){
return document.getElementById(o);
}
var IsStop = false;
var s;
function Show(o){
var ow = parseInt($(o).style.width);
var oh = parseInt($(o).style.height);
if(ow < 200 && IsStop){
$(o).style.width = ow + 5 + "px";
$(o).style.height = oh + 2 + "px";
}
if(ow > 0 && !IsStop){
$(o).style.width = ow - 5 + "px";
$(o).style.height = oh - 2 + "px";
if(ow == 5){
$(o).style.display = 'none';
}
}
if(ow >= 0 && ow <= 200){
s = setTimeout("Show('" + o + "')", 1);
}
}
function getDefaultStyle(o, a){
return o.currentStyle ? o.currentStyle[a] : document.defaultView.getComputedStyle(o, false)[a];
}
$('but').onmouseover = function(){
with($('but_temp').style){
width = '0';
height = '0';
top = this.offsetTop + this.offsetHeight + 'px';
right = document.documentElement.clientWidth - this.offsetLeft - this.offsetWidth + 'px';
display = 'block';
}
IsStop = true;
s && clearTimeout(s);
Show('but_temp');
this.onmouseout = $('but_temp').onmouseout = function(e){
var e = window.event || e;
var s = e.toElement || e.relatedTarget;
if(s != $('but_temp') && s.parentNode != $('but_temp')){
IsStop = false;
}
}
}
</script>
</body>
</html>
黑色头发:http://heisetoufa.iteye.com/