http://zsc521521.blog.163.com/blog/static/42233196200846570134/
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>MouseOverPopWindowDemo</title>
<script language="javascript">
<!--
//代码整理:Melodicsoul http://wintersun.cnblogs.com
//2007年5月21日
var FADINGTOOLTIP
var wnd_height, wnd_width;
var tooltip_height, tooltip_width;
var tooltip_shown=false;
var transparency = 100;
var timer_id = 1;
// override events
window.onload = WindowLoading;
window.onresize = UpdateWindowSize;
document.onmousemove = AdjustToolTipPosition;
setTimeout('window.location.reload(true)', 1140000); // 19 minutes
function DisplayTooltip(tooltip_text)
{
if (FADINGTOOLTIP) {
FADINGTOOLTIP.innerHTML = tooltip_text;
tooltip_shown = (tooltip_text != "")? true : false;
if(tooltip_text != "")
{
// Get tooltip window height
tooltip_height=(FADINGTOOLTIP.style.pixelHeight)? FADINGTOOLTIP.style.pixelHeight : FADINGTOOLTIP.offsetHeight;
transparency=0;
ToolTipFading();
}
else
{
clearTimeout(timer_id);
FADINGTOOLTIP.style.visibility="hidden";
}
}
}
function AdjustToolTipPosition(e)
{
if (navigator.userAgent.toLowerCase().indexOf("msie") != -1)
e = event;
if( tooltip_shown )
{
offset_y = 20;//(e.clientY + tooltip_height - document.body.scrollTop + 30 >= wnd_height) ? - 15 - tooltip_height: 20;
FADINGTOOLTIP.style.visibility = "visible";
FADINGTOOLTIP.style.left = Math.min(wnd_width - tooltip_width - 10 , Math.max(3, e.clientX + 6)) + document.body.scrollLeft + 'px';
FADINGTOOLTIP.style.top = e.clientY + offset_y + document.body.scrollTop + 'px';
}
}
function WindowLoading()
{
FADINGTOOLTIP=document.getElementById('FADINGTOOLTIP');
// Get tooltip window width
tooltip_width = (FADINGTOOLTIP.style.pixelWidth) ? FADINGTOOLTIP.style.pixelWidth : FADINGTOOLTIP.offsetWidth;
// Get tooltip window height
tooltip_height=(FADINGTOOLTIP.style.pixelHeight)? FADINGTOOLTIP.style.pixelHeight : FADINGTOOLTIP.offsetHeight;
FADINGTOOLTIP.style.left = 0;
FADINGTOOLTIP.style.top = 0;
UpdateWindowSize();
}
function ToolTipFading()
{
if(transparency <= 100)
{
FADINGTOOLTIP.style.filter="alpha(opacity="+transparency+")";
transparency += 10;
timer_id = setTimeout('ToolTipFading()', 10);
}
}
function UpdateWindowSize()
{
wnd_height=document.body.clientHeight;
wnd_width=document.body.clientWidth;
}
-->
</script>
</HEAD>
<body>
<form name="Form1">
<DIV id="mainPane">
<a href="http://wintersun.cnblogs.com" onmouseover="DisplayTooltip('<iframe src=http://wintersun.cnblogs.com width=100% height=300px scrolling=no></iframe>');" onmouseout="DisplayTooltip('');">鼠标划过</a>
</DIV>
<div class="FadingTooltip" id="FADINGTOOLTIP" style="Z-INDEX: 103; LEFT: 16px; VISIBILITY: hidden; WIDTH: 360px; POSITION: absolute; TOP: 478px; HEIGHT: 30px">
</div>
</form>
</body>
</html>