[發明專利]采用HTML5技術對網頁內容進行分頁顯示的方法

有效

• 申請號: 201310233801.8
• 申請日: 2013-06-14
• 公開（公告）號: CN103294819B
• 公開（公告）日: 2018-08-31
• 發明（設計）人: 張昀
• 申請（專利權）人: 北京新學堂網絡科技有限公司
• 主分類號: G06F17/30
• 分類號: G06F17/30
• 代理公司: 暫無信息
• 代理人: 暫無信息

1.一種采用HTML5技術對網頁內容進行分頁顯示的方法，其特征在于：包括以下步驟：

(1)網頁上需要分頁顯示的基本內容單元，是圖書中的一個連續的、沒有人工預先設定好分頁的內容區塊，不同圖書設置內容區塊的方式不一樣，內容區塊可以是圖書的一個章，也可以不是；

(2)將較長的網頁內容根據圖書的每個章，分拆為多個小節，需要將較長的網頁內容進行拆分，拆分為若干個小節，這個拆分的部分，稱為“小節”，將很多個小節組合起來，共同構成完整的分頁效果，然后一部分一部分地顯示在欄目中；

(3)計算出每個小節的高度，然后計算出“剩余影響”；小節的“剩余影響”，在排版仍然要考慮在內，計算出每個小節對后面的小節的“剩余影響”，計算出了剩余影響，以后各個小節排列時，只要考慮到前一個小節的“剩余影響”，就可以通過多個小節的組合，實現較長內容的分欄排版；

(4)生成一系列頁面對象，每個頁面對象包含合適的欄內容，從而看上去像圖書的“一頁”，首先，將分欄中的一個欄，變為一個獨立的頁面；具體的做法：將分欄中的欄的尺寸，設置為和頁面尺寸同樣大小；設定頁面為容器，其中包含分欄內容；調整分欄的margin-left參數，讓想要的欄出現在最左邊；分欄內容的父對象，父對象的寬度設置為頁面的寬度，這樣超出這個寬度的欄，都不會顯示出來，父對象的高度就設置為頁面的高度，分欄的高度也設置為頁面的高度，頁面的高度的計算方法為：創建一個臨時的頁面對象為“高度探測對象”，因為小節的高度，必須實際賦予了DOM對象才能測試出來，因此，需要通過臨時的頁面對象，臨時賦予小節內容，并測量其高度，這個臨時頁面對象的尺寸應該和正式的頁面完全一樣，并且其寬度和高度在可視區域之外，這樣在測試高度時，不會引起屏幕刷新，所得到的每個小節的高度即頁面的高度，分欄對象的margin-left設置為若干欄的寬度，這樣在父對象中，就能顯示出指定的欄；規定頁面的尺寸，讓剩余的欄不顯示出來；通過這樣的設置，就可以讓頁面顯示指定的一個欄；就將分欄中的一個欄，轉化為了一個獨立的頁面，為了提高性能，每個頁面就不能包含所有的欄，只包含其要顯示的欄，多余的欄越少越好；

(5)將HTML5的內容拆分為很多個獨立的頁面對象生成后，可以根據需要進行顯示或者設置翻頁效果，翻頁效果的實現，實際上就是對頁面進行某種切換。