js實現div滾動條在頁面刷新 滾動條位置固定


思想:1.通過div的onscroll事件記錄滾動條的scrollTop值,設置到document.cookie
2.頁面加載時再讀取document.cookie的值,設置給div的scrollTop

js代碼實現:

        function KeepScrollBar() {
            var scrollPos;
            if (typeof window.pageYOffset != 'undefined') {
                scrollPos = window.pageYOffset;
            }
            else if (typeof document.body != 'undefined') {
            scrollPos = document.getElementById('divContent').scrollTop;
            }
        document.cookie = "scrollTop=" + scrollPos; //スクロールバーの位置をcookiesに保存する
        }

        window.onload = function () {
            if (document.cookie.match(/scrollTop=([^;]+)(;|$)/) != null) {
                var arr = document.cookie.match(/scrollTop=([^;]+)(;|$)/); //cookiesに値があれば、スクロールバーの位置を読み込み
                document.getElementById('divContent').scrollTop = parseInt(arr[1]);
            }
        }

 html代碼:

   <div id="divContent" style="margin: 7px 0px; clear: both; overflow: scroll; overflow-x: hidden;
            text-align: left; width: 1340px; padding: 0px 10px 0px 0px;" onscroll= "KeepScrollBar()">

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM