[sos]问个JQuery问题

弹出层用jquery实现了
随着滚动条的下拉，弹出层也始终居中
可是会像机关枪一样，一直闪。
该怎么让它不会像机关枪一样一直闪，而且始终都居中呢？
求高手帮忙！

解决方案 »

  1.   

    关键是DIV top 和left 需要重新计算再定位的。所以会一直刷新的。
      

  2.   

    没用jquery，甚至没用javascript，只用的样式<html>
    <head>
    <style>
    html,body,#divMain{height:100%;}
    html,body{overflow:hidden;}
    #divMain{overflow:auto;}
    #divCover{position:absolute;top:20%;left:20%;border:1px solid black;width:60%;height:60%;}
    </style>
    </head><body>
    <div id="divCover">就是不动</div>
    <div id="divMain">
    <div style="height:2000px;">我是内容</div>
    </div>
    </body>
    </html>
      

  3.   


    $("Message").css({top:"20%",left:"20%"})
    #Message{width:371px; height:302px; display:none; z-index:3; position:absolute;}为什么我这样弄后没反应呢？
    变成在左上角了！
      

  4.   

    直接设置在样式里面就有反应
    #Message{width:371px; height:302px; display:none; z-index:3; position:absolute; top:50%;left:50%}是我的jquery写错吗？
      

  5.   

    大侠
    $("#Message").css({top:"50%",left:"50%"});
    这样为什么不会随着滚动条始终居中呢？
      

  6.   


    思路：主要内容放在 divMain 里面，居中层和 divMain 同级，滚动的时候实际上用的是 divMain 的滚动条，这样就达到了居中层不随主要内容滚动而滚动另外，如果要居中不能用 50% ，top 应该是 可用区域高度减去居中层高度，然后除以2
    就是 (document.body.offsetHeight - document.getElementById("divCover").offsetHeight) / 2
      

  7.   


    <div id="back"></div>
        <div id="Message">
            <div class="mleft"></div>
            <div class="mcenter">
                <div class="mctop">
                    <a>消息提示</a>
                    <span id="close">关闭</span>
                </div>
                <div class="mccontent">
                    this is a 消息
                </div>
            </div>
            <div class="mright"></div>
        </div>我是让我的遮罩层和弹出层同级这样可以吗？还是该怎么弄？
    效果还是显示不出来！
      

  8.   

    给你推荐我研究过的一个东西，IE6下模拟position:fixed，应该对你有所帮助：
    http://blog.csdn.net/pillar0514/archive/2010/02/09/5303061.aspx
      

  9.   

    back 是居中层，还是 Message，按照实际情况改一下
    <html>
    <head>
    <style>
    html,body,#divMain{height:100%;}
    html,body{overflow:hidden;}
    #divMain{overflow:auto;}
    #back{position:absolute;top:20%;left:20%;border:1px solid black;}
    </style>
    <script>
    function resetCover(id){
    var obj = document.getElementById(id);
    obj.style.top = (document.body.offsetHeight - obj.offsetHeight) / 2 + "px";
    obj.style.left = (document.body.offsetWidth - obj.offsetWidth) / 2 + "px";
    }
    </script>
    </head><body onload="resetCover('back')" onresize="resetCover('back')">
    <div id="back">
        <div id="Message">
            <div class="mleft"></div>
            <div class="mcenter">
                <div class="mctop">
                    <a>消息提示</a>
                    <span id="close">关闭</span>
                </div>
                <div class="mccontent">
                    this is a 消息
                </div>
            </div>
            <div class="mright"></div>
        </div>
    </div><div id="divMain">
    <div style="height:2000px;">我是内容</div>
    </div>
    </body>
    </html>