<!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=utf-8" />
<title>可隐藏</title>
</head>
<script language="JavaScript" type="text/javascript">
lastScrollY=0;
function fudong(){
var diffY;
if (document.documentElement && document.documentElement.scrollTop)
diffY = document.documentElement.scrollTop;
else if (document.body)
diffY = document.body.scrollTop
percent=0.1*(diffY-lastScrollY);
if(percent>0)
percent=Math.ceil(percent);
else
percent=Math.floor(percent);
document.getElementById("d1").style.top=parseInt(document.getElementById("d1").style.top)+percent+"px";
document.getElementById("d2").style.top=parseInt(document.getElementById("d1").style.top)+percent+"px";
lastScrollY=lastScrollY+percent;
}
window.setInterval("fudong()",1);
function xianshi(){
document.getElementById("d1").style.display="block";
document.getElementById("d1").style.left=0+"px";
document.getElementById("d2").style.left=167+"px";
}
function yincang(){
document.getElementById("d1").style.display="none";
document.getElementById("d1").style.left=-167+"px";
document.getElementById("d2").style.left=0+"px";
}
</script>
<style type="text/css">
body{ text-align:center; margin:0; padding:0;}
#d1 { width:167px;height:130px; display:none;}
#d2{width:12px; height:100px; background:#CCC; border:1px solid #999; color:#666; font-size:12px;}
.main{width:400px;height:2500px;}
</style>
</head>
<body>
<div id="d1" style="position:absolute;left:-167px;top:200px;"><img src="1.jpg" onmouseover="xianshi()" onmouseout="yincang()"></div>
<div id="d2" style="position:absolute;left:0px;top:200px;" onmouseover="xianshi()" onmouseout="yincang()">隐藏的广告</div>
<div class="main"></div>
</body>
</html>