ie浏览器div随滚动条滚动


 第一种方法:

html,body{height:100%; width:100%; overflow:hidden}
#content{ height:100%; overflow:auto; overflow-x:hidden; width:100%}//#content可换成body


<div id="content">
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />  <br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
    
<br /><br /><br /><br /><br /><br /><br /><br />
    
</div>
    
<div style="width:200px; height:200px; position:absolute; z-index:1; border:solid 1px #000000; left:0; top:80px; background:#eee;"> </div>

 第二种方法:

<!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>
    
<title>Untitled Page</title>
</head>
<body>
    
<div style="height: 1000px">
    
</div>
    
<img id="imgico" style="position: absolute" src="http://www.baidu.com/img/baidu_logo.gif" />
</body>
</html>

<script type="text/javascript">
   
   
    
function $(id){return document.getElementById(id);}
   
    
    
function ScrollImg(id)
    
{
        
var img = $(id);
        img.style.top 
= (document.documentElement.scrollTop+(document.documentElement.clientHeight -img.offsetHeight)/2)+"px";
    }
 

    $(
"imgico").style.left = (document.documentElement.clientWidth - $("imgico").offsetWidth) +"px"
    ScrollImg(
"imgico");  
    window.onscroll
=function()
   
{
        ScrollImg(
"imgico");
   }
  
</script>

 

posted @ 2009-06-24 10:59  瞭望者  阅读(635)  评论(0编辑  收藏  举报