<html>
<head>
<script>
function move() 
{
var d= document.getElementById("div1");
d.style.Top= document.body.scrollTop+10;
}
setTimeout("move()",50);
</script>
<style type="text/css"> 
#div1
{
position:absolute;
left:100px;
top:10px;
width:100px;
height:500px;
border:1px solid black; 
z-index:"50";
}
</style>
</head>
<body id="div1" onscroll="move()" >
<div id="div1" >
<h3>可随滚动条移动的窗口</h3>
</div>
<div>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
<p>1111111111111</p>
</div>
</body>
</html>
请教各位大神,我是新手,想自己编个随滚动条移动的图层的代码,可是上面的代码我运行了,图层怎么不动啊?我错了哪里了,望各位大神指导。在这里先谢谢你了。

解决方案 »

  1.   

    d.style.Top= (document.body.scrollTop || document.documentElement.scrollTop) +10;
      

  2.   

    function move() 
    {
    var d= document.getElementById("div1");
    //d.style.Top= document.body.scrollTop+10;
     d.style.Top= (document.body.scrollTop || document.documentElement.scrollTop) +10; 
    }
    是不是这样啊朋友,但是那个div1图层还是没动啊。
      

  3.   

    d.style.Top= (document.body.scrollTop || document.documentElement.scrollTop) +10 +'px' 
      

  4.   

    JavaScript code?
     d.style.Top= (document.body.scrollTop || document.documentElement.scrollTop) +10 +'px' 
     朋友加了'px'还是不动。
      
      

  5.   

    <style type="text/css"> 
    #div1
    {
    position:fixed;
    left:100px;
    top:10px;
    width:100px;
    height:500px;
    border:1px solid black; 
    z-index:"50";
    }
    </style>
    滚动啥啊,直接position:fixed;就好了。
      

  6.   


    function move(){
         var d = document.getElementById("div1");
         var scrollTop = ((document.body.scrollTop)+10);
         d.style.top = scrollTop+'px';
    }
    setInterval(move(),30);这样修改一下就可以了
      

  7.   


    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <style type="text/css">
            #div1
            {
                position:absolute;
                left:100px;
                top:10px;
                width:100px;
                height:500px;
                border:1px solid black;
                z-index:5;
            }
        </style>
        <script type="text/javascript">
            function move(){
                var d=document.getElementById("div1");
                d.style.top = document.body.scrollTop+10+"px";
            }
            window.onscroll=function(){
                move();
            }
        </script>
    </head>
    <body>
    <div id="div1" >
        <h3>可随滚动条移动的窗口</h3>
    </div>
    <div>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
        <p>1111111111111</p>
    </div>
    </body>
    </html>
      

  8.   

    写了一个实例:
    你看一下:
    <script type="text/javascript">
     //<![CDATA[
     var tips; var theTop = 250/*这是默认高度*/; var old = theTop;
     function initFloatTips() {
       tips = document.getElementById('floatTips');
       moveTips();
     };
     function moveTips() {
       var tt=50;
       if (window.innerHeight) {
         pos = window.pageYOffset
       }
       else if (document.documentElement && document.documentElement.scrollTop) {
         pos = document.documentElement.scrollTop
       }
       else if (document.body) {
         pos = document.body.scrollTop;
       }
       pos=pos-tips.offsetTop+theTop;
       pos=tips.offsetTop+pos/10;
       if (pos < theTop) pos = theTop;
       if (pos != old) {
         tips.style.top = pos+"px";
         tt=10;
       }
       old = pos;
       setTimeout(moveTips,tt);
     }
     //!]]>
     </script>
     <style type="text/css">
     div#floatTips{
      position:absolute;
      border:solid 1px #777;
      padding:3px;
      top:250px;
      width:300px;
      background:#333;
      color:white;
      opacity: 0.5;/*这两句没法通过验证的*/
      filter:alpha(opacity=50);/*这两句没法通过验证的*/
     }
     </style>
     <body onload="initFloatTips()">
     <div id="floatTips">
      这是一个浮动的半透明层哦,可以通过css,xhtml验证的哦,不信,你试试~
     </div>
     </body>