CN103390010B - A kind of display packing of browser page and system - Google Patents
A kind of display packing of browser page and system Download PDFInfo
- Publication number
- CN103390010B CN103390010B CN201210333469.8A CN201210333469A CN103390010B CN 103390010 B CN103390010 B CN 103390010B CN 201210333469 A CN201210333469 A CN 201210333469A CN 103390010 B CN103390010 B CN 103390010B
- Authority
- CN
- China
- Prior art keywords
- footer
- top margin
- code
- page
- document
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Landscapes
- Information Transfer Between Computers (AREA)
Abstract
The invention provides a kind of display packing of browser page and system, the method includes：Default page code file is parsed and is rendered, obtained the page showing；The described page comprises the first top margin, the first footer and document, and described document includes the second top margin, content and the second footer, and the attribute of described first top margin and the first footer is to be not take up document, and the attribute of described second top margin and the second footer is to take document.The technical scheme being provided according to the present invention, it is possible to increase the development efficiency of browser page, reduces development cost.
Description
【Technical field】
The present invention relates to the page composition technology of the Internet, more particularly, to a kind of display packing of browser page and be
System.
【Background technology】
At present, in the typesetting technique of browser page, by by the attribute of top margin and footer be set to fixing so that top margin
Depart from document with footer, and be suspended on document, be not take up document so that top margin and footer do not roll with scroll bar；Institute
State document and be used for the position that in regulation browser page, display content takies in typesetting.In browser page, most of display is right
The default setting of elephant is static, and that is, top margin and footer, without departing from document, take document, belong to a part for document, for example, Fig. 1
It is the structural representation of browser page, as shown in figure 1, needing in browser page to show top margin, content, footer；If will
Top margin and footer are set to static state, will obtain the true page shown in Fig. 2, because top margin and footer take document, the height of document
Degree is equal to the summation of top margin height, content height and footer height, and the height of document just exceeds the height of browser forms, leads to
Partial content in document and footer just can must be seen by dragging scroll bar and rolling.In order to solve this problem, as Fig. 3 institute
Show, so that top margin and footer disengaging document, top margin and footer are individually fixed in top and the bottom of browser forms, do not make
For a part for document, in document, only comprise content, document height is equal to content height；So, because top margin and footer depart from
Document, then when carrying out typesetting to the page, content area is no longer from the beginning of the bottom that top margin is occupied, but initiateing from document
Position starts, and in the same manner, footer also will not be located at the position at content end, and is in the bottom of browser forms, now, browses
Device forms height is equal to document height, leads to partial content in document to be covered it is impossible to show by top margin and footer, even if dragging rolling
Dynamic bar to bottom, footer also still covering part content.
At present, for solving the problems, such as shown in Fig. 2 and Fig. 3, as shown in Figure 4 it will usually the top margin of set content and following
Away from reserving the white space of equivalent top margin height and footer height before and after content so that the content shown is not by top margin and page
Foot covers；But this method must know top margin height and footer height in advance；If top margin height and footer are highly unknown,
And still using the method, then need to design corresponding CSS for each browser page, or loaded in page code
Read top margin height and footer height after finishing, then the top margin of content and following is highly reseted according to top margin height and footer
Away from so, extra development cost will be produced, and development efficiency is low；After exploitation finishes, if top margin and footer become
More, maintenance cost will also be increased.
Additionally, the typesetting technique of above-mentioned browser page is applied to relatively common in computer, and implementation method is very
Simply, the height of such as set content is fixed, is arranged scroll bar automatically；But, in the browser of current Android terminal
Can not support that these are simply arranged, thus have to rely on third-party JavaScript framework and carry out solve problem,
JavaScript framework, while solve problem, also will bring extra resource overhead, and realize rolling
Iscroll framework in JavaScript framework in solve problem, process of realizing more complicated it is easy to can send out with browser
Raw conflict, thus lead to the collapse of whole browser.
【Content of the invention】
The invention provides a kind of display packing of browser page and system, it is possible to increase the exploitation effect of browser page
Rate, reduces development cost.
The concrete technical scheme of the present invention is as follows：
According to one preferred embodiment of the present invention, a kind of display packing of browser page, including：
Default page code file is parsed and is rendered, obtained the page showing；The described page comprises page 1
Head, the first footer and document, described document includes the second top margin, content and the second footer, described first top margin and the first footer
Attribute be to be not take up document, the attribute of described second top margin and the second footer is to take document.
In said method, described default page code file is parsed and is rendered before, the method also includes：
Replicate the first top margin code in page code file and the first footer code, obtain the second top margin code and second
The page code file of footer code；
In wherein said first top margin code and the first footer code, the positioning properties of the first top margin and the first footer are solid
Fixed, in the second top margin code and the second footer code, the positioning properties of the second top margin and the second footer are set to static state, institute
Stating positioning properties is the second static top margin and the second footer occupancy document.
In said method, the described top margin code replicating in page code file and footer code are：
Receive user replicates respectively to the first top margin code in parent page code file and the first footer code
The the second top margin code obtaining afterwards and the second footer code.
In said method, the described top margin code replicating in page code file and footer code are：
Compiler finds described page code file according to the path of input, comprises to have and answer in described page code file
First top margin code of identifier processed and the first footer code, when being compiled to described page code file, according to described
Duplication identifier carries out duplication to described first top margin code and the first footer code and obtains the second top margin code and the second footer
Code.
In said method, the method also includes：
In the second top margin code and the second footer code, by the display characteristic attribute setting of the second top margin and the second footer
It is hiding；Wherein, described display characteristic attribute is the second hiding top margin and the second footer does not appear in browser forms.
In said method, described default page code file is resolved to：
Described page code file is parsed, obtains showing object, replicate the first top margin object in display object
With the first footer object, obtain the second top margin object and the second footer object；
In the CSS of wherein said first top margin object and the first footer object, the positioning of the first top margin and the first footer
Attribute is to fix, in the CSS of the second top margin object and the second footer object, by the positioning of the second top margin and the second footer
Attribute is set to static state, and wherein, described positioning properties are the second static top margin and the second footer takies document.
In said method, described the first top margin object replicating in display object and the first footer object are：
According to the display object of instruction in the order receiving and described order, to the first top margin object and the first footer object
Replicated；
The dom tree of described display object composition creates new branch, described new branch and the first top margin object and
The branch of the first footer object is at the same level；
The the second top margin object obtaining and the second footer object leaf node as new branch will be replicated.
In said method, the method also includes：
In the CSS of described second top margin object and the second footer object, by the display of the second top margin and the second footer
Property attribute is set to hide；Wherein, described display characteristic attribute be the second hiding top margin and the second footer do not appear in clear
Look in device forms.
The present invention also provides a kind of display system of browser page, including browser；It is single that described browser includes parsing
Unit and rendering unit；Wherein,
Resolution unit, for parsing to default page code file；
Rendering unit, renders for the page code file after resolution unit is parsed, and obtains the page showing；Institute
State the page and comprise the first top margin, the first footer and document, described document includes the second top margin, content and the second footer, described
The attribute of one top margin and the first footer is to be not take up document, and the attribute of described second top margin and the second footer is to take document.
In said system, this system also includes：
Copied cells, for replicating the first top margin code in page code file and the first footer code, obtains second
Top margin code and the page code file of the second footer code；In wherein said first top margin code and the first footer code, the
The positioning properties of one top margin and the first footer are to fix, in the second top margin code and the second footer code, by the second top margin and
The positioning properties of the second footer are set to static state, and described positioning properties are the second static top margin and the second footer takies document.
In said system, when described copied cells is located at browser, page in replicating page code file for the copied cells
When head code and footer code, specially：
Receive user replicates respectively to the first top margin code in parent page code file and the first footer code
The the second top margin code obtaining afterwards and the second footer code.
In said system, when described copied cells is located at compiler, described copied cells is in replicating page code file
Top margin code and during footer code, specially：
Described page code file is found according to the path of input, in described page code file, comprises that there is duplication mark
First top margin code of symbol and the first footer code, when being compiled to described page code file, replicate mark according to described
Knowledge symbol carries out duplication to described first top margin code and the first footer code and obtains the second top margin code and the second footer code.
In said system, described copied cells, it is additionally operable in the second top margin code and the second footer code, by page 2
The display characteristic attribute of head and the second footer is set to hide；Wherein, described display characteristic attribute be the second hiding top margin and
Second footer does not appear in browser forms.
In said system, described resolution unit further includes：Parsing subelement and duplication subelement；Wherein,
Described parsing subelement, for parsing to described page code file, obtains showing object；
Described duplication subelement, for replicating the first top margin object and the first footer object in display object, obtains the
Two top margin objects and the second footer object；In the CSS of wherein said first top margin object and the first footer object, page 1
The positioning properties of head and the first footer are to fix；It is additionally operable in the CSS of the second top margin object and the second footer object, will
The positioning properties of the second top margin and the second footer are set to static state, and wherein, described positioning properties are the second static top margin and the
Two footers take document.
In said system, the described subelement that replicates is replicating the first top margin object and the first footer object showing in object
When, specially：
According to the display object of instruction in the order receiving and described order, to the first top margin object and the first footer object
Replicated；
The dom tree of described display object composition creates new branch, described new branch and the first top margin object and
The branch of the first footer object is at the same level；
The the second top margin object obtaining and the second footer object leaf node as new branch will be replicated.
In said system, described duplication subelement, it is additionally operable to the sample in described second top margin object and the second footer object
In formula table, the display characteristic attribute of the second top margin and the second footer is set to hide；Wherein, described display characteristic attribute is hidden
The second top margin hidden and the second footer do not appear in browser forms.
As can be seen from the above technical solutions, what the present invention provided has the advantages that：
Original top margin and footer are used for showing, duplicated top margin and footer are as void as real top margin and footer
The top margin intended and footer occupy-place in a document, on the premise of not knowing top margin height and footer height in advance, can either avoid
Original top margin and footer cover the content of document, can ensure that there is top margin and footer in the page of display again simultaneously, fall
The development cost of the low page and maintenance cost, improve development efficiency.
【Brief description】
Fig. 1 is the structural representation of browser page；
Fig. 2 is the first display schematic diagram of browser page；
Fig. 3 is the second display schematic diagram of browser page；
Fig. 4 is the 3rd display schematic diagram of browser page；
Fig. 5 is the schematic flow sheet of the preferred embodiment one of the display packing that the present invention realizes browser page；
Fig. 6 is the schematic flow sheet of the preferred embodiment two of the display packing that the present invention realizes browser page；
Fig. 7 is the structural representation of the preferred embodiment one of the display system that the present invention realizes browser page；
Fig. 8 is the structural representation of the preferred embodiment two of the display system that the present invention realizes browser page；
Fig. 9 be the details within mobile member card and list page in classical example screening item open before schematic diagram；
Figure 10 be the details within mobile member card and list page in classical example screening item open after schematic diagram.
【Specific embodiment】
In order that the object, technical solutions and advantages of the present invention are clearer, below in conjunction with the accompanying drawings with specific embodiment pair
The present invention is described in detail.
The present invention provides a kind of display packing of browser page, and the method includes：
Default page code file is parsed and is rendered, obtained the page showing；The described page includes page 1
Head, the first footer and document, described document includes the second top margin, content and the second footer, described first top margin and the first footer
Attribute be to be not take up document, the attribute of described second top margin and the second footer is to take document.
Fig. 5 is the schematic flow sheet of the preferred embodiment one of the display packing that the present invention realizes browser page, as Fig. 5 institute
Show, the preferred embodiment comprises the following steps：
Step 501, replicates the first top margin code in page code file and the first footer code, obtained for the second top margin generation
Code and the page code file of the second footer code；In wherein said first top margin code and the first footer code, the first top margin
Positioning properties with the first footer are to fix, in the second top margin code and the second footer code, by the second top margin and page 2
The positioning properties of foot are set to static state, and described positioning properties are the second static top margin and the second footer takies document.
Specifically, in generating page code file processes, browser receive user inputs in page code file
Two identical top margin codes and two identical footer codes, wherein, the first top margin code and the first footer code are respectively
The original top margin code of user input and original footer code, the second top margin code and the second footer code are respectively duplicated
First top margin code and duplicated first footer code, the second top margin code and the second footer code are users to the first top margin
Code and the first footer code are input in page code file after being replicated；Or, after generating page code file, right
The code compiling is needed to add unique identifier, for example, to the first top margin generation in page code file in page code file
Code and the first footer code add duplication identifier；The page code file consolidation needing compiling is uploaded to back-end services by user
Under the particular category of device, compiler finds according to the path of user input needs the page code file of compiling, and compiler is to adding
Plus the page code file of unique identifier is compiled, if the first top margin code and the first footer generation in page code file
Code is added with duplication identifier, then compiler is carried out to the first top margin code and the first footer code that are added with duplication identifier
Replicate；After compiler is compiled to page code file, export the page code file after compiling, in the present embodiment, compiling
Two identical top margin codes and two identical footer codes, wherein page 1 will be comprised in the page code file of device output
Head code and the first footer code respectively original top margin code of user input and original footer code, the second top margin code and the
Two footer codes are respectively the first top margin code and the duplicated first footer code that compiler self-replication goes out；So, right
Including two identical top margin codes and two identical footer codes page code file parsed and rendered after, obtain
The page in there will be two top margins and two footers；In the preferred embodiment of the present invention, user is the exploit person of browser page
Member.
In the second top margin code and the second footer code, weight is carried out to the association attributes of the second top margin and the second footer
Put, including the replacement of positioning properties and display characteristic attribute；Wherein, the replacement of positioning properties is by the second top margin and the second footer
Positioning properties reset to static state, the default value due to position field in the first top margin code and the first footer code is
Fixed, represents that positioning properties are to fix, then replicating the second top margin obtaining and the positioning properties of the second footer is also to fix,
It is defaulted as departing from document, after page code file is loaded, the second top margin and the second page footing are fixed position in browser forms,
In the present embodiment, need to be changed to the assignment of the position field in the second top margin code and the second footer code by fixed
Static, represents that the positioning properties of the second top margin and the second footer are static state, and that is, the second top margin and the second footer be without departing from document,
Take document, after page code file is loaded, the second top margin and the second page footing belong to a part for document, and in a document
Position is fixed, and is located at the two ends of document；The replacement of display characteristic attribute is by the display characteristic of the second top margin and the second page footing
Attribute reset to hiding, due to visibility field in the first top margin code and the first footer code default value be sky,
After page code file is loaded, the first top margin and the first footer can show in browser forms, in the present embodiment, need
The assignment of the visibility field replicating in the second top margin code and the second footer code obtaining is changed to hidden by sky,
I.e. the second top margin and the second footer do not show, after page code file is loaded, the second top margin and the second footer are in browser window
Do not show in body, will be blank above the content of document and below content, the blank of top takies document but do not show
Second top margin, the blank of lower section is to take document but the second footer of not showing；Here, the replacement of display characteristic attribute is optional
The display characteristic attribute of the second top margin and the second footer, in order to reach more preferable visual effect, can be reset to hiding by operation.
Step 502, parses and renders the page code file comprising two top margin codes and two footer codes, shown
The page showing；The attribute of described first top margin and the first footer is to be not take up document, the genus of described second top margin and the second footer
Property for take document.
Specifically, first, the file address of browser receiving user's input, according to this document address in back-end server
Find corresponding page code file；Secondly, the page to two top margin codes of the inclusion found and two footer codes for the browser
Face code file is parsed, and obtains dom tree；Then；The document dbject model that browser obtains to parsing（DOM, Document
Object Model）Tree is rendered, and obtains the page showing；Wherein, dom tree is the group shaping of multiple display objects in the page
Formula, dom tree is used for limiting the logical relation between code and attribute in page code file；Wherein, due to the first top margin code and
In first footer code, the positioning properties of the first top margin and the first footer are defaulted as fixing, therefore, the first top margin and the first footer
Depart from document, browser resolves after rendering page code file, the first top margin and the first footer position in browser forms
Fixing；And in the second top margin code and the second footer code, the positioning properties of the second top margin and the second footer are static state, therefore,
Second top margin and the second footer without departing from document, that is, take document, to page code document analysis and after rendering, the second top margin and
Second footer belongs to a part for document, and position is fixed in a document, and is individually fixed in the two ends of document；Due to positioning properties
Display layer for the first fixing top margin and the second footer is superior to the second top margin that positioning properties are static state and the second footer
Display layer rank, the therefore first top margin and the first footer acquiescence be displayed on the second top margin and the and the upper strata of footer, but
Because the second top margin and the second footer belong to a part for document and display characteristic attribute is not show, the second top margin and page 2
Foot is located at the two ends of document so that the two ends in document are blank as virtual top margin and footer, when the second top margin is located at
During browser forms top, even if the second top margin covers document, also only cover virtual the second top margin in document, that is, cover literary composition
The blank parts on shelves top, are not covered with the content in document, in the same manner, when the second footer is located at browser bottom, even if the
One footer covers document, also only covers virtual the second footer in document, that is, covers the blank parts of bottom in document, do not have
There is the content covering in document.
Fig. 6 is the schematic flow sheet of the preferred embodiment two of the composition method that the present invention realizes browser page, as Fig. 6 institute
Show, the preferred embodiment comprises the following steps：
Step 601, parses to default page code file, obtains showing object, replicates the in display object
One top margin object and the first footer object, obtain the second top margin object and the second footer object；Wherein said first top margin object
In the CSS of the first footer object, the positioning properties of the first top margin and the first footer are to fix, in the second top margin object and
In the CSS of the second footer object, the positioning properties of the second top margin and the second footer are set to static state, wherein, described positioning
Attribute is the second static top margin and the second footer takies document.
Specifically, the file address of browser receiving user's input, finds in back-end server according to this document address
Corresponding page code file；Browser parses to the page code file finding, and obtains dom tree；Wherein, dom tree is
The composition form of multiple display objects in the page；User calls the interface function of JavaScript script offer by HTML mode
DomObject.cloneNode (), sends order to browser；Browser is aobvious according to indicate in the order receiving and this order
Show object, know and need the first top margin object and the first footer object are replicated；Browser creates one on described dom tree
Individual new branch, new branch is branch at the same level with the branch of the first top margin object and the first footer object, replicates the obtaining
, as the leaf node of new branch, so, dom tree has two identical top margins pair for two top margin objects and the second footer object
As with two identical footer objects.
Association attributes in the CSS of the second top margin object and the second footer object, to the second top margin and the second footer
Reset, including the replacement of positioning properties and display characteristic attribute；Wherein, by the second top margin object and the second footer object
The assignment of the position field in CSS is changed to static by the fixed giving tacit consent to, and represents the second top margin and the second footer
Positioning properties are static state, and that is, the second top margin and the second footer, without departing from document, take document, after browser renders to dom tree,
Second top margin and the second footer belong to a part for document, and position is fixed in a document, and are located at the two ends of document；By second
The assignment of the visibility field in the CSS of top margin object and the second footer object is changed to hidden by the sky given tacit consent to, that is,
Second top margin and the second footer do not show, after browser renders to dom tree, the second top margin and the second footer are in browser forms
In do not show, above the content of document and will be blank below content, the blank of top be occupancy document but do not show the
Two top margins, the blank of lower section is to take document but the second footer of not showing；Here, the replacement of display characteristic attribute is optional behaviour
Make, in order to reach more preferable visual effect, the display characteristic attribute of the second top margin and the second footer can be reset to hiding.
Step 602, the display object that parsing is obtained renders, and obtains the page showing；Described first top margin and
The attribute of one footer is to be not take up document, and the attribute of described second top margin and the second footer is to take document.
Specifically, browser is being parsed to page code file and is being obtained two identical top margin objects and footer pair
As rear, dom tree is rendered, obtain the page showing；Wherein, the first top margin and the first footer depart from document, are shown
The page after, the first top margin and the first footer are fixed position in browser forms；Second top margin object and the second footer object
In, the positioning properties of the second top margin and the second footer are static state, and the second top margin and the second footer without departing from document, that is, take literary composition
Shelves, after obtaining the page, the second top margin and the second footer belong to a part for document, fix in a document, and are individually fixed in literary composition
The two ends of shelves；When the second top margin is located at browser forms top, the first top margin covers virtual the second top margin in document, does not have
Cover the content in document, in the same manner, when the second footer is located at browser bottom, the first footer covers virtual second in document
Footer, is not covered with the content in document.
In above preferred embodiment, original top margin and footer are used for showing as real top margin and footer, copy
Top margin and footer as virtual top margin and footer occupy-place in a document, do not knowing top margin height and footer height in advance
Under the premise of, original top margin and footer can either be avoided to cover the content of document, can ensure that in the page of display simultaneously again
There is top margin and footer, reduce development cost and the maintenance cost of the page, improve development efficiency；Further, since not utilizing
JavaScript framework, or carry out showing the duplication of object merely with JavaScript framework, simple to operate, therefore by above-mentioned skill
When art scheme is applied to Android terminal, also will not clash with browser, it is to avoid browser collapses；Additionally, utilizing
Compiler replicates to top margin code and footer code, and the side that browser is replicated to top margin object and footer object
During case, if necessary to be adjusted to the content of top margin and footer, then can only change original top margin and footer, compiler or
Browser can replicate to amended top margin and footer automatically, can reduce maintenance cost, improves development efficiency.
For realizing said method, the present invention also provides a kind of composing system of browser page, and it is clear that Fig. 7 is that the present invention realizes
Look at the device page the preferred embodiment one of composing system structural representation, Fig. 8 is the typesetting that the present invention realizes browser page
The structural representation of the preferred embodiment two of system, as shown in Figure 7 and Figure 8, this system includes browser；Described browser includes
Resolution unit 11 and rendering unit 12；Wherein,
Resolution unit 11, for parsing to default page code file；
Rendering unit 12, for rendering to the page code file after resolution unit 11 parsing, obtains the page showing
Face；The described page comprises the first top margin, the first footer and document, and the attribute of described first top margin and the first footer is to be not take up literary composition
Shelves, the attribute of described second top margin and the second footer is to take document.
As shown in fig. 7, this system also includes：
Copied cells 13, for replicating the first top margin code in page code file and the first footer code, obtains
Two top margin codes and the page code file of the second footer code；In wherein said first top margin code and the first footer code,
The positioning properties of the first top margin and the first footer are to fix, in the second top margin code and the second footer code, by the second top margin
It is set to static state with the positioning properties of the second footer, described positioning properties are the second static top margin and the second footer takies literary composition
Shelves.
Wherein, when described copied cells 13 is located at browser, top margin in replicating page code file for the copied cells 13
When code and footer code, specially：
Receive user replicates respectively to the first top margin code in parent page code file and the first footer code
The the second top margin code obtaining afterwards and the second footer code.
Wherein, when described copied cells 13 is located at compiler, described copied cells 13 is in replicating page code file
When top margin code and footer code, specially：
Described page code file is found according to the path of input, in described page code file, comprises that there is duplication mark
First top margin code of symbol and the first footer code, when being compiled to described page code file, replicate mark according to described
Knowledge symbol carries out duplication to described first top margin code and the first footer code and obtains the second top margin code and the second footer code.
Wherein, described copied cells 13, is additionally operable in the second top margin code and the second footer code, by the second top margin and
The display characteristic attribute of the second footer is set to hide；Wherein, described display characteristic attribute is hiding the second top margin and second
Footer does not appear in browser forms.
As shown in figure 8, described resolution unit 11 further includes to parse subelement 110, replicate subelement 112；Wherein,
Described parsing subelement 110, for parsing to described page code file, obtains showing object；
Described duplication subelement 112, for replicating the first top margin object and the first footer object in display object, obtains
Second top margin object and the second footer object；In the CSS of wherein said first top margin object and the first footer object, first
The positioning properties of top margin and the first footer are to fix；It is additionally operable to the CSS in described second top margin object and the second footer object
In, the positioning properties of the second top margin and the second footer are set to static state, wherein, described positioning properties are the second static top margin
Take document with the second footer.
Wherein, when described duplication subelement 112 shows the first top margin object and the first footer object in object in duplication,
It is specially：
According to the display object of instruction in the order receiving and described order, to the first top margin object and the first footer object
Replicated；
The dom tree of described display object composition creates new branch, described new branch and the first top margin object and
The branch of the first footer object is at the same level；
The the second top margin object obtaining and the second footer object leaf node as new branch will be replicated.
Wherein, described duplication subelement 112, is additionally operable to the CSS in described second top margin object and the second footer object
In, the display characteristic attribute of the second top margin and the second footer is set to hide；Wherein, described display characteristic attribute is hiding
Second top margin and the second footer do not appear in browser forms.
For example, classical example is the details within mobile member card and list page, as shown in figure 9, wherein, list is interior
Hold, the top screening information such as item is top margin, lower state hurdle be footer it can be seen that content number do not interfere with the whole of the page
The change of body layout, as shown in Figure 10, compared with Fig. 9, after in the top margin in Figure 10, screening item is opened, the size of content area is sent out
Give birth to change, but the size of integral layout and the page has not changed, android terminal can drag content in the page and carry out
Roll, only the list items in content roll with the page.
The foregoing is only presently preferred embodiments of the present invention, not in order to limit the present invention, all essences in the present invention
Within god and principle, any modification, equivalent substitution and improvement done etc., should be included within the scope of protection of the invention.
Claims (14)
1. a kind of display packing of browser page is it is characterised in that the method includes：
Default page code file is parsed and is rendered, obtained the page showing；The described page comprise the first top margin,
One footer and document, described document includes the second top margin, content and the second footer, the attribute of described first top margin and the first footer
For being not take up document, the attribute of described second top margin and the second footer is to take document；Wherein,
Described default page code file is parsed and is rendered before, the method also includes：
Replicate the first top margin code in page code file and the first footer code, obtain the second top margin code and the second footer
The page code file of code；
In wherein said first top margin code and the first footer code, the positioning properties of the first top margin and the first footer are to fix,
In the second top margin code and the second footer code, the positioning properties of the second top margin and the second footer are set to static state, described
Positioning properties are the second static top margin and the second footer takies document.
2. method according to claim 1 is it is characterised in that the top margin code in described duplication page code file and page
Foot code is：
Receive user obtains after the first top margin code in parent page code file and the first footer code are replicated respectively
The the second top margin code arriving and the second footer code.
3. method according to claim 1 is it is characterised in that the top margin code in described duplication page code file and page
Foot code is：
Compiler finds described page code file according to the path of input, comprises there is duplication mark in described page code file
Know the first top margin code and the first footer code of symbol, when being compiled to described page code file, according to described duplication
Identifier carries out duplication to described first top margin code and the first footer code and obtains the second top margin code and the second footer code.
4. method according to claim 1 is it is characterised in that the method also includes：
In the second top margin code and the second footer code, the display characteristic attribute of the second top margin and the second footer is set to hidden
Hide；Wherein, described display characteristic attribute is the second hiding top margin and the second footer does not appear in browser forms.
5. method according to claim 1 is it is characterised in that described resolve to default page code file：
Described page code file is parsed, obtains showing object, replicate the first top margin object and the in display object
One footer object, obtains the second top margin object and the second footer object；
In the CSS of wherein said first top margin object and the first footer object, the positioning properties of the first top margin and the first footer
For fixation, in the CSS of the second top margin object and the second footer object, by the positioning properties of the second top margin and the second footer
It is set to static state, wherein, described positioning properties are the second static top margin and the second footer takies document.
6. method according to claim 5 is it is characterised in that described duplication shows the first top margin object and the in object
One footer object is：
According to the display object of instruction in the order receiving and described order, the first top margin object and the first footer object are carried out
Replicate；
The dom tree of described display object composition creates new branch, described new branch and the first top margin object and first
The branch of footer object is at the same level；
The the second top margin object obtaining and the second footer object leaf node as new branch will be replicated.
7. method according to claim 5 is it is characterised in that the method also includes：
In the CSS of described second top margin object and the second footer object, by the display characteristic of the second top margin and the second footer
Attribute is set to hide；Wherein, described display characteristic attribute is the second hiding top margin and the second footer does not appear in browser
In forms.
8. a kind of display system of browser page is it is characterised in that this system includes browser；Described browser includes parsing
Unit and rendering unit；Wherein,
Resolution unit, for parsing to default page code file；
Rendering unit, renders for the page code file after resolution unit is parsed, and obtains the page showing；Described page
Bread contains the first top margin, the first footer and document, and described document includes the second top margin, content and the second footer, described page 1
The attribute of head and the first footer is to be not take up document, and the attribute of described second top margin and the second footer is to take document；Wherein,
This system also includes：
Copied cells, for replicating the first top margin code in page code file and the first footer code, obtains the second top margin
Code and the page code file of the second footer code；In wherein said first top margin code and the first footer code, page 1
The positioning properties of head and the first footer are to fix, in the second top margin code and the second footer code, by the second top margin and second
The positioning properties of footer are set to static state, and described positioning properties are the second static top margin and the second footer takies document.
9. system according to claim 8 is it is characterised in that when described copied cells is located at browser, copied cells exists
When replicating top margin code and the footer code in page code file, specially：
Receive user obtains after the first top margin code in parent page code file and the first footer code are replicated respectively
The the second top margin code arriving and the second footer code.
10. system according to claim 8 it is characterised in that described copied cells be located at compiler when, described duplication list
When first top margin code in replicating page code file and footer code, specially：
Described page code file is found according to the path of input, comprises in described page code file to have and replicate identifier
First top margin code and the first footer code, when being compiled to described page code file, according to described duplication identifier
Duplication is carried out to described first top margin code and the first footer code and obtains the second top margin code and the second footer code.
11. systems according to claim 8 it is characterised in that described copied cells, be additionally operable in the second top margin code and
In second footer code, the display characteristic attribute of the second top margin and the second footer is set to hide；Wherein, described display characteristic
Attribute is the second hiding top margin and the second footer does not appear in browser forms.
12. systems according to claim 8 are it is characterised in that described resolution unit further includes：Parsing subelement and
Replicate subelement；Wherein,
Described parsing subelement, for parsing to described page code file, obtains showing object；
Described duplication subelement, for replicating the first top margin object and the first footer object in display object, obtains page 2
Head object and the second footer object；In the CSS of wherein said first top margin object and the first footer object, the first top margin and
The positioning properties of the first footer are to fix；It is additionally operable in the CSS of the second top margin object and the second footer object, by second
The positioning properties of top margin and the second footer are set to static state, and wherein, described positioning properties are the second static top margin and page 2
Foot takies document.
13. systems according to claim 12 it is characterised in that described duplication subelement in replicating display object the
When one top margin object and the first footer object, specially：
According to the display object of instruction in the order receiving and described order, the first top margin object and the first footer object are carried out
Replicate；
The dom tree of described display object composition creates new branch, described new branch and the first top margin object and first
The branch of footer object is at the same level；
The the second top margin object obtaining and the second footer object leaf node as new branch will be replicated.
14. systems according to claim 12, it is characterised in that described duplication subelement, are additionally operable in described page 2
In the CSS of head object and the second footer object, the display characteristic attribute of the second top margin and the second footer is set to hide；
Wherein, described display characteristic attribute is the second hiding top margin and the second footer does not appear in browser forms.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201210333469.8A CN103390010B (en) | 2012-09-10 | 2012-09-10 | A kind of display packing of browser page and system |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201210333469.8A CN103390010B (en) | 2012-09-10 | 2012-09-10 | A kind of display packing of browser page and system |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN103390010A CN103390010A (en) | 2013-11-13 |
| CN103390010B true CN103390010B (en) | 2017-03-08 |
Family
ID=49534286
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201210333469.8A Active CN103390010B (en) | 2012-09-10 | 2012-09-10 | A kind of display packing of browser page and system |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN103390010B (en) |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101621862A (en) * | 2009-08-11 | 2010-01-06 | 中兴通讯股份有限公司 | Method and device for positioning effective information rapidly for mobile phone browser |
| CN101685447A (en) * | 2008-09-28 | 2010-03-31 | 国际商业机器公司 | Method and system for processing CSS in segment cut and mesh-up of Web page |
| CN102073502A (en) * | 2011-01-11 | 2011-05-25 | 百度在线网络技术（北京）有限公司 | Method for rendering page frame by WEB primary layout and device thereof |
| CN102185923A (en) * | 2011-05-16 | 2011-09-14 | 广州市动景计算机科技有限公司 | Webpage browsing method for mobile communication equipment terminal |
| CN102314426A (en) * | 2010-06-30 | 2012-01-11 | 上海视加信息科技有限公司 | System for distributively creating webpage |
Family Cites Families (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US7613645B2 (en) * | 2002-10-15 | 2009-11-03 | Timothy Knight | Electronic interface configured for displaying and identifying mixed types of information |
-
2012
- 2012-09-10 CN CN201210333469.8A patent/CN103390010B/en active Active
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101685447A (en) * | 2008-09-28 | 2010-03-31 | 国际商业机器公司 | Method and system for processing CSS in segment cut and mesh-up of Web page |
| CN101621862A (en) * | 2009-08-11 | 2010-01-06 | 中兴通讯股份有限公司 | Method and device for positioning effective information rapidly for mobile phone browser |
| CN102314426A (en) * | 2010-06-30 | 2012-01-11 | 上海视加信息科技有限公司 | System for distributively creating webpage |
| CN102073502A (en) * | 2011-01-11 | 2011-05-25 | 百度在线网络技术（北京）有限公司 | Method for rendering page frame by WEB primary layout and device thereof |
| CN102185923A (en) * | 2011-05-16 | 2011-09-14 | 广州市动景计算机科技有限公司 | Webpage browsing method for mobile communication equipment terminal |
Non-Patent Citations (1)
| Title |
|---|
| 如何将页脚固定在页面底部;大漠;《http://www.w3cplus.com/css/css-sticky-foot-at-bottom-of-the-page 》;20110915;1-5 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN103390010A (en) | 2013-11-13 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN102663126B (en) | Method and device for displaying webpage in mobile terminal | |
| CN103544178B (en) | It is a kind of for providing the method and apparatus of reconstruction page corresponding with target pages | |
| CN103701909B (en) | The rapid generation and system of Video Applications | |
| CN107818143A (en) | A kind of page configuration, generation method and device | |
| CN106469047A (en) | A kind of list implementation method and device | |
| CN104798067B (en) | Dictionary system and dictionary call method | |
| CN102831190B (en) | A kind of method that CML files are browsed in low side devices | |
| CN104599144A (en) | Method and device for generating product details page | |
| CN106339414A (en) | Webpage rendering method and device | |
| CN103186655A (en) | Processing method and device for layout file | |
| CN102819561A (en) | Picture display method and device based on webpage | |
| CN102510377A (en) | Webpage interaction accelerating asynchronous data processing method and system | |
| CN106886551A (en) | A kind of method and device of utilization markup language display image | |
| CN102880708A (en) | Visual design system and method for implementing hypertext markup language (HTML) page | |
| CN105094775A (en) | Webpage generation method and apparatus | |
| CN102346619A (en) | Network television for user to customize user interface (UI) and customization method for network television | |
| CN107066496A (en) | A kind of page access method of compatible different browsers and terminal device | |
| CN101860734A (en) | Method for implementing incremental transmission and display of dynamic images through AJAX | |
| CN103345522B (en) | Displaying processing, methods of exhibiting and the device of data | |
| CN104268163A (en) | Method and system for acquiring network management network element configuration interface | |
| CN106484384A (en) | A kind of page animation methods of exhibiting and system | |
| Chivarov et al. | Interactive presentation of the exhibits in the museums using mobile digital technologies | |
| CN107451163A (en) | A kind of cartoon display method and device | |
| AU2015220950B2 (en) | Reservation system and method therefor | |
| CN103390010B (en) | A kind of display packing of browser page and system |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| ASS | Succession or assignment of patent right |
Owner name: BAIDU IN LINE NETWORK TECHNOLOGY CO LTD (BEOJING) Free format text: FORMER OWNER: LEHO (BEIJING) TECHNOLOGY CO., LTD. Effective date: 20131028 |
|
| C41 | Transfer of patent application or patent right or utility model | ||
| COR | Change of bibliographic data |
Free format text: CORRECT: ADDRESS; FROM: 100101 CHAOYANG, BEIJING TO: 100085 HAIDIAN, BEIJING |
|
| TA01 | Transfer of patent application right |
Effective date of registration: 20131028 Address after: 100085 Beijing, Haidian District, No. ten on the street Baidu building, No. 10 Applicant after: BEIJING BAIDU NETCOM SCIENCE AND TECHNOLOGY Co.,Ltd. Address before: 100101, building 2, building 8, Beichen West Road, Beijing, Chaoyang District, A1209 Applicant before: Philharmonic active (Beijing) Technology Co., Ltd. |
|
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| C14 | Grant of patent or utility model | ||
| GR01 | Patent grant |