最近在做一个类似于 rga.com 网页界面, 有上方的导航区和下方的可滚动内容区. 导航区和内容区都居中且左右边竖直对齐. 浏览器滚动条用于滚动内容区. 导航区为静止.现在我有2问题:
1) 用magin:auto 使上下两区都居中的话, 内容区的宽度要减去一个滚动条的宽度,所以上下两区的左右两边不能对齐
2) 如果浏览器的宽度小于导航区的宽度, 导航区会覆盖内容区的滚动条.大家可以用css试试能不能完美解决这些问题. 如果用javascript我想使用类似jquery - ready() 的方法,即在网页显示之前完成定位, 但是不肯定ready() 的方法用javascript 如何实现(不使用jquery), 希望高手帮忙看看.谢谢
 

解决方案 »

  1.   


    var ready=function(readyCall) {
        if(document.addEventListener)
            document.addEventListener("DOMContentLoaded",function() {
                document.removeEventListener("DOMContentLoaded",arguments.callee,false);
                readyCall();
            },false);
        else if(document.attachEvent) {//for IE
            if(document.documentElement.doScroll && window.self==window.top) {
                (function() {
                    try {
                        document.documentElement.doScroll("left");
                    }catch(ex) {
                        setTimeout(arguments.callee,5);
                        return;
                    }
                    readyCall();
                })();
            }else {//maybe late but also for iframes
                document.attachEvent("onreadystatechange",function() {
                    if(document.readyState==="complete") {
                        document.detachEvent("onreadystatechange", arguments.callee);
                        readyCall();
                    }
                });
            }
        }
    }
      

  2.   

    LS 能否帮忙写个范例, ready 函数定义有了, 但是如何实现呢?
      

  3.   

    多谢<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
        <head>
            <script language="javascript">
                function readyCall(){
                    alert("DS");
                }
               function when_ready(readyCall) {
                    if(document.addEventListener)
                        document.addEventListener("DOMContentLoaded",function() {
                            document.removeEventListener("DOMContentLoaded",arguments.callee,false);
                            readyCall();
                        },false);
                    else if(document.attachEvent) {//for IE
                        if(document.documentElement.doScroll && window.self==window.top) {
                            (function() {
                                try {
                                    document.documentElement.doScroll("left");
                                }catch(ex) {
                                    setTimeout(arguments.callee,5);
                                    return;
                                }
                               readyCall();
                            })();
                        }else {//maybe late but also for iframes
                            document.attachEvent("onreadystatechange",function() {
                                if(document.readyState==="complete") {
                                    document.detachEvent("onreadystatechange", arguments.callee);
                                    readyCall();
                                }
                            });
                        }
                    }
                }
                when_ready(readyCall);
            </script>
        </head>
        <body>
            <img src="http://www.ari.uni-heidelberg.de/gaia/gallery/GR/gr0283-01.artistic-Gaia-Galaxy-large.jpg">
            
        </body>
    </html>