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  瞭望者  阅读(640)  评论(0)    收藏  举报