需求：頁面content分爲左右兩欄，左側固定定位，滾動顯示，右側亦可滾動查看

如題，content寬度爲1200px，代碼第一版以下所示:

<script type="text/javascript" >
    function menuFixed(id){
        $('#rightanswer').css('height', document.documentElement.clientHeight*0.86+'px');
        $('#viewerPlaceHolder').css('height', document.documentElement.clientHeight*0.86+'px');
        $('#viewQuestionBankDiv').css('height', document.documentElement.clientHeight*0.86+'px');
        var obj = document.getElementById(id);
        var _getHeight = obj.offsetTop;

        window.onscroll = function(){
            changePos(id,_getHeight);
        }
    }
    function changePos(id,height){
        var obj = document.getElementById(id);
        var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
        if(scrollTop < height){
            obj.style.position = 'relative';
            obj.style.top="0px";
        }else{
            obj.style.position = 'fixed';
            obj.style.top="80px";
            document.getElementById('flowId').style.minHeight='800px';
        }
    }

    window.onload = function(){
        menuFixed('nav_keleyi_com');
        $(".addNewScroll").mCustomScrollbar();
    }
</script>

clinetWidth大於1200px，頁面效果，即指望效果： 

clinetWidth小於1200px，頁面效果

代碼完善：

<script type="text/javascript" >
    function menuFixed(id){
        $('#rightanswer').css('height', document.documentElement.clientHeight*0.86+'px');
        $('#viewerPlaceHolder').css('height', document.documentElement.clientHeight*0.86+'px');
        $('#viewQuestionBankDiv').css('height', document.documentElement.clientHeight*0.86+'px');
        var obj = document.getElementById(id);
        var _getHeight = obj.offsetTop;

        window.onscroll = function(){
            changePos(id,_getHeight);
        }
    }
    function changePos(id,height){
        var obj = document.getElementById(id);
        var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
        if(scrollTop < height){
            obj.style.position = 'relative';
            obj.style.top="0px";
            document.getElementById('nav_keleyi_com').style.left='0';
        }else{
            obj.style.position = 'fixed';
            obj.style.top="80px";
            document.getElementById('flowId').style.minHeight='800px';

            var cw = document.documentElement.clientWidth;
            if(cw < 1200){ //用於解決 --》 當瀏覽器寬度小於1200時，因固定定位的文檔脫流而使得scroll-x左右拖動後，右側內容被蓋住的問題， ‘20’指的是wrap的padding值
                var sl=-Math.max(document.body.scrollLeft,document.documentElement.scrollLeft);
                var sl= sl+20;
                document.getElementById('nav_keleyi_com').style.left= sl +'px';
            }else {
                var fixed_left = parseInt((cw-1200)/2 + 20); //計算出sw大於1200時，左右的margin大小
                document.getElementById('nav_keleyi_com').style.left= fixed_left +'px';
            }
        }
    }
</script>