CN105677893A - Web page display method and device - Google Patents

Web page display method and device Download PDF

Info

Publication number
CN105677893A
CN105677893A CN201610074908.6A CN201610074908A CN105677893A CN 105677893 A CN105677893 A CN 105677893A CN 201610074908 A CN201610074908 A CN 201610074908A CN 105677893 A CN105677893 A CN 105677893A
Authority
CN
China
Prior art keywords
attribute data
sidebar
main body
css attribute
adjusted
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.)
Pending
Application number
CN201610074908.6A
Other languages
Chinese (zh)
Inventor
沈兴华
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Oneplus Technology Shenzhen Co Ltd
Original Assignee
Oneplus Technology Shenzhen Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Oneplus Technology Shenzhen Co Ltd filed Critical Oneplus Technology Shenzhen Co Ltd
Priority to CN201610074908.6A priority Critical patent/CN105677893A/en
Publication of CN105677893A publication Critical patent/CN105677893A/en
Pending legal-status Critical Current

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/957Browsing optimisation, e.g. caching or content distillation

Landscapes

  • Engineering & Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Data Mining & Analysis (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

The invention relates to a web page display method which comprises the following steps: acquiring an input operation instruction for triggering the display of a sidebar; adjusting a right attribute value in corresponding CSS attribute data of the sidebar from a negative preset width value to 0 according to the operation instruction, and adjusting a left attribute value in the corresponding CSS attribute data of a page body in the web from 0 to the negative preset width value, wherein the positioning attribute in the corresponding CSS attribute data of the sidebar is fixed positioning; the positioning attribute in the corresponding CSS attribute data of the page body is relative positioning. Due to adoption of the method, the operation convenience of a user can be improved. In addition, the invention also provides a web page display device.

Description

Webpage display packing and device
Technical field
The present invention relates to field of computer technology, particularly to a kind of Webpage display packing and device.
Background technology
Sidebar and navigation menu are two important compositions in webpage, and sidebar belongs to a kind of form facilitating feature operation, are commonly used to the part resource of integrated process or place some quick entrances, and user plays the effect reminded or navigate. Sidebar is very common on desktop system, website, also often can see the application of sidebar in the mobile tablet device that display area is bigger.
But, in conventional art, sidebar is generally individually fixed on page both sides, so, sidebar will necessarily be caused to occupy the Free Region of page main body, cause reducing of page body region scope, affect user operation, especially for the mobile electronic device that some display screens are less, it is easier to cause the inconvenience of user operation.
Summary of the invention
Based on this, in order to solve above-mentioned technical problem, it is provided that a kind of Webpage display packing that can improve user operation convenience and device.
A kind of Webpage display packing, the method includes:
Obtain the operational order triggering display sidebar of input;
According to this operational order, the right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to this negative predetermined width value by 0;
Wherein, the positioning properties in the corresponding CSS attribute data of this sidebar is stationary positioned, and the positioning properties in the corresponding CSS attribute data of this page main body is relative localization.
Wherein in an embodiment, described method also includes:
When getting described operational order, adjust the hierarchical value preset in mask layer corresponding CSS attribute data so that described default mask layer is adjusted between described page main body and described sidebar by under described page main body, and the transparent Style Attributes in the CSS attribute data of described mask layer is adjusted to from invisible.
Wherein in an embodiment, the positioning properties in the corresponding CSS attribute data of described default mask layer is stationary positioned, and described default mask layer corresponding CSS attribute data also comprises the specially good effect attribute making described default mask layer be shown as gradually going out effect.
Wherein in an embodiment, described sidebar corresponding CSS attribute data comprises makes described sidebar be shown as the specially good effect attribute skidded off from right side, comprises and make described page main body be shown as the specially good effect attribute skidded off to the left in described page main body corresponding CSS attribute data.
Wherein in an embodiment, described, right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and by the left property value in the page main body corresponding CSS attribute data in webpage by, after 0 step being adjusted to described negative predetermined width value, also including:
Detect whether to get the clicking operation to described page predeterminable area;
If getting the clicking operation to described page main body, then the right property value in corresponding for sidebar CSS attribute data is adjusted to negative predetermined width value by 0, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to 0 by described negative predetermined width value, and the hierarchical value in described default mask layer corresponding CSS attribute data is adjusted to it is positioned under described page main body and described transparent Style Attributes is invisible.
A kind of Webpage display device, this device includes:
Acquiring unit, for obtaining the operational order triggering display sidebar of input;
First adjustment unit, for according to this operational order, right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to this negative predetermined width value by 0;
Arranging unit, be stationary positioned for the positioning properties arranged in the corresponding CSS attribute data of this sidebar, the positioning properties in the corresponding CSS attribute data of this page main body is relative localization.
Device according to claim 6, it is characterised in that described device also includes:
Second adjusting module, for when getting described operational order, adjust the hierarchical value preset in mask layer corresponding CSS attribute data so that described default mask layer is adjusted between described page main body and described sidebar by under described page main body, and the transparent Style Attributes in the CSS attribute data of described mask layer is adjusted to from invisible.
Wherein in an embodiment, the positioning properties in the corresponding CSS attribute data of described default mask layer is stationary positioned, and described default mask layer corresponding CSS attribute data also comprises the specially good effect attribute making described default mask layer be shown as gradually going out effect.
Wherein in an embodiment, described sidebar corresponding CSS attribute data comprises makes described sidebar be shown as the specially good effect attribute skidded off from right side, comprises and make described page main body be shown as the specially good effect attribute skidded off to the left in described page main body corresponding CSS attribute data.
Wherein in an embodiment, described device also includes:
Detection module, for detecting whether get the clicking operation to described page predeterminable area;
3rd adjusting module, if getting the clicking operation to described page main body for described detection module, then the right property value in corresponding for sidebar CSS attribute data is adjusted to negative predetermined width value by 0, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to 0 by described negative predetermined width value, and the hierarchical value in described default mask layer corresponding CSS attribute data is adjusted to it is positioned under described page main body and described transparent Style Attributes is invisible.
Above-mentioned Webpage display packing and device, by obtaining the operational order triggering display sidebar of input; According to this operational order, the right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to this negative predetermined width value by 0;Wherein, the positioning properties in the corresponding CSS attribute data of this sidebar is stationary positioned, and the positioning properties in the corresponding CSS attribute data of this page main body is relative localization. So, when getting corresponding operating instruction by adjusting the CSS attribute data of sidebar and page main body, sidebar is made to be become display state from hidden state, and page main body moves integrally with the sidebar shown, sidebar will not shelter from the region of page main body when not in use, and without sheltering from page main body after showing, thus improve user operation convenience.
Accompanying drawing explanation
Fig. 1 is the flow chart of Webpage display packing in an embodiment;
Fig. 2 is the flow chart of Webpage display packing in another embodiment;
Fig. 3 is the flow chart of Webpage display packing in further embodiment;
Fig. 4 is the structured flowchart of Webpage display device in an embodiment;
Fig. 5 is the structured flowchart of Webpage display device in another embodiment;
Fig. 6 is the structured flowchart of Webpage display device in another embodiment.
Detailed description of the invention
In order to make the purpose of the present invention, technical scheme and advantage clearly understand, below in conjunction with drawings and Examples, the present invention is further elaborated. Should be appreciated that specific embodiment described herein is only in order to explain the present invention, is not intended to limit the present invention.
As it is shown in figure 1, in one embodiment, it is provided that a kind of Webpage display packing, including:
Step 102, obtains the operational order triggering display sidebar of input.
In the present embodiment, when not getting the operational order triggering display sidebar of input, sidebar is initially hidden state. Trigger the operational order of display sidebar, include but not limited to be the click at the edge to web page display area or pull instruction. Such as, for the mobile terminal with touching display screen, can pass through to click the edge of the web page display area that (click or double-click) touches display screen, or pull from this edge toward the center position of web page display area, thus triggering display sidebar. Sidebar refers to the content being shown in webpage side, wherein can provide some menu items or quick entrance etc.
Step 104, according to this operational order, right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to this negative predetermined width value by 0; Wherein, the positioning properties in the corresponding CSS attribute data of this sidebar is stationary positioned, and the positioning properties in the corresponding CSS attribute data of this page main body is relative localization.
CSS (CSS) is a kind of computer language for showing the file patterns such as HTML or XML, and CSS defines the Show Styles of the content in webpage. Sidebar corresponding CSS attribute data comprises right property value and positioning properties, page main body corresponding CSS attribute data comprises left property value and positioning properties. Wherein, right property value refers to that the right hand edge of sidebar is from the distance between the right hand edge of web page display area, and left property value refers to that the left hand edge of page main body is from the distance between the left hand edge of web page display area. Positioning properties refers to the type that interface element positions, including stationary positioned and relative localization.
In the present embodiment, right property value in sidebar corresponding CSS attribute data is initially set to negative predetermined width value, this predetermined width value is the width of sidebar, thus realizing sidebar to be initially hidden state, namely Webpage does not initially show sidebar. When getting the operational order triggering display sidebar of input, the right property value adjusted in the CSS attribute data of sidebar is 0 so that sidebar moves to the right side edge being shown in Webpage from the right side of Webpage.
Accordingly, the left property value adjusted in page main body corresponding CSS attribute data is negative predetermined width value so that page main body is moved to the left, and the distance of movement is the width value of sidebar. Owing to the positioning properties in the corresponding CSS attribute data of sidebar is stationary positioned, and the positioning properties in the CSS attribute data of page main body is relative localization, therefore, moving integrally of page main body and sidebar can be realized, sidebar will not shelter from the region of page main body when not in use, and without sheltering from page main body after showing, thus improve user operation convenience.
Further, in one embodiment, the corresponding CSS attribute data of sidebar comprises so that sidebar is shown as the specially good effect attribute that skids off from right side, comprises, in the corresponding CSS attribute data of page main body, the specially good effect attribute making page main body be shown as skidding off to the left. In the present embodiment, by arranging the specially good effect attribute of sidebar and page main body, can either be slided out by hidden state by sidebar, be capable of again the animation effect that web page body slides to the left from right side together with sidebar, improve user operation convenience and also improve Consumer's Experience.
In one embodiment, as shown in Figure 2, it is provided that a kind of Webpage display packing, including:
Step 202, obtains the operational order triggering display sidebar of input.
Step 204, according to operational order, right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to this negative predetermined width value by 0, wherein, positioning properties in the corresponding CSS attribute data of this sidebar is stationary positioned, and the positioning properties in the corresponding CSS attribute data of this page main body is relative localization.
Step 206, adjust the hierarchical value preset in the corresponding CSS attribute data of mask layer so that presetting mask layer and being adjusted between page main body and sidebar by under page main body, and the transparent Style Attributes in the CSS attribute data of mask layer is adjusted to from invisible.
In the present embodiment, also comprising hierarchical value in the corresponding CSS attribute data of sidebar, page main body and mask layer, hierarchical value defines corresponding level. In an initial condition, the hierarchical value of mask layer is positioned under page main body, and transparent Style Attributes is invisible, and therefore mask layer is sightless in an initial condition. When getting operational order, the hierarchical value of mask layer is adjusted between page main body and sidebar, and its transparent Style Attributes is adjusted to visible. So, mask layer has sheltered from page main body but has not sheltered from sidebar so that the display of sidebar seems and becomes apparent from, convenient for users to use.
Further, in one embodiment, the positioning properties preset in the corresponding CSS attribute data of mask layer is stationary positioned, presets mask layer corresponding CSS attribute data and also comprises the specially good effect attribute making described default mask layer be shown as gradually going out effect. In the present embodiment, by arranging the corresponding specially good effect attribute of mask layer so that mask layer has an animation effect gradually gone out when showing, and improves Consumer's Experience.
More specifically, in one embodiment, page body matter can be set and wrapped up by a div (division, figure layer), and sidebar and mask layer sane level, jointly wrapped up by the div that view port width is consistent.Illustrating, the topology example of page main body, sidebar and mask layer is as follows:
<divid=" op-wrap ">
<divid="op-aside"></div>
<divid="op-mask"></div>
<divid="op-content"></div>
</div>
Wherein, father node is the div of id=" op-wrap ", and can arrange its width is 100% so that it is the same with the view port width of browser, and it is hiding for arranging beyond part. The css code of its correspondence is:
#op-wrap{width:100%; Overflow:hidden; }
Wherein, width is width, and overflow:hidden represents that spilling part is hiding.
Wherein,<divid=" op-wrap ">represents Webpage,<divid=" op-aside ">represents sidebar,<divid=" op-mask ">represents mask layer,<divid=" op-content ">representation page main body, from logic level, Webpage is father node, and page main body, mask layer and Webpage are child node.
Concrete, the CSS code of page main body (div of id=" op-content ") is as follows:
#op-content{position:relative; Left:0; Top:0; Transition:all0.2s; }
Wherein, position represents positioning properties, is initially set to relative, and namely the positioning properties of page main body is relative localization. Left represents left property value, is initially set to 0, top and represents and be initially set to distance with top 0, transition and represent specially good effect attribute, and the persistent period is 0.2s.
Concrete, the CSS code of sidebar is as follows:
#op-aside{position:fixed; Right:-450px; Top:0; Z-index:10000; Transition:all0.2s; }
Wherein, the positioning properties " position " of sidebar (div of id=" op-aside ") is initially set to stationary positioned " fixed ", right attribute " right " value of sidebar is negative predetermined width value "-450px ", 450px is the width value of sidebar, level " z-index " is set to the highest by 10000, the value of top attribute is 0, represents that the top of this sidebar is consistent with browser view port. Owing to the right property value of sidebar is set to the width value born, therefore sidebar original state is invisible on the page. Transition represents specially good effect attribute, and the persistent period is 0.2s. Sidebar is consistent with the specially good effect attribute of page main body, is all from right side toward left slide, and the persistent period of sliding is all 0.2s.
Concrete, the CSS code of mask layer is:
#op-mask{position:fixed; Z-index:-1; Top:0; Left:0; Width:100%; Height:100%; Opacity:0; Transition:all0.2s; }
Wherein, the CSS attribute data of this mask layer includes positioning properties " position ", its value is set to stationary positioned " fixed ", its level attributes " z-index " value is "-1 ", represent that the original state of mask layer is for being positioned under page main body, the value of top attribute " top " is 0, it is with sidebar, page main body sane level, left attribute " left " value is 0, the value of width width is " 100% ", consistent with browser view port width, the value of height attributes " height " is 100%, consistent with browser width. Opacity is transparent Style Attributes, is initially set to 0, represents that transparency is 0, invisible.
Further, when getting the operational order triggering display sidebar, available Javascript technology is that page main body div, sidebar div and mask layer div are plus corresponding class class name.The right value making sidebar div becomes 0, in conjunction with transition specially good effect attribute so that sidebar can realize the animation effect skidded off from right side. Simultaneously, the left value changing page main body div is-450px, in conjunction with the transition specially good effect attribute of page main body so that page main body realizes the animation effect slided to the left together with sidebar, the distance slided is 450px, it is achieved thereby that page main body also sidebar whole slide. Simultaneously, the opacity value changing mask layer is 1, represent visible, and the z-index of mask layer is become 1000, make the level of mask layer between page main body and sidebar, such mask layer covers page main body when being not covered with sidebar, and the transition specially good effect attribute of mask layer makes mask layer occur in that an animation effect gradually gone out simultaneously.
In one embodiment, as shown in Figure 3, it is provided that a kind of Webpage display packing, including:
Step 302, obtains the operational order triggering display sidebar of input.
Step 304, according to operational order, right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to this negative predetermined width value by 0, wherein, positioning properties in the corresponding CSS attribute data of this sidebar is stationary positioned, and the positioning properties in the corresponding CSS attribute data of this page main body is relative localization.
Step 306, adjust the hierarchical value preset in the corresponding CSS attribute data of mask layer so that presetting mask layer and being adjusted between page main body and sidebar by under page main body, and the transparent Style Attributes in the CSS attribute data of mask layer is adjusted to from invisible.
Step 308, detects whether to get the clicking operation to page predeterminable area, if so, then enters step 310, otherwise terminates.
Step 310, right property value in corresponding for sidebar CSS attribute data is adjusted to negative predetermined width value by 0, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to 0 by the predetermined width value born, and the hierarchical value in corresponding for default mask layer CSS attribute data is adjusted to it is positioned under page main body and described transparent Style Attributes is invisible.
In the present embodiment, page predeterminable area is preferably the viewing area of mask layer, and after mask layer shows, user clicks mask layer again, then the CSS attribute data of sidebar, page main body and mask layer is adjusted to initial value. Concrete, the right value of sidebar is become the predetermined width value born, as above in example, becomes-450px. The left value of page main body is become 0. Meanwhile, being adjusted in place by the hierarchical value of mask layer under page main body and described transparent Style Attributes is invisible, as above in example, the hierarchical value of mask layer becomes-1, opacity value and becomes 0.
In the present embodiment, when getting user to the clicking operation of page predeterminable area, original state is reverted to by by sidebar and page main body and mask layer, setting by the CSS attribute data of sidebar and page main body, page main body and sidebar can entirety be slided to the right, and sidebar stashes. Can be restPosed by shirtsleeve operation, thus improve user operation convenience.
As shown in Figure 4, in one embodiment, additionally providing a kind of Webpage display device, this device includes:
Acquisition module 402, for obtaining the operational order triggering display sidebar of input.
First adjusting module 404, for according to this operational order, right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to negative predetermined width value by 0.
In the present embodiment, the positioning properties in the corresponding CSS attribute data of sidebar is stationary positioned, and the positioning properties in the corresponding CSS attribute data of page main body is relative localization.
As it is shown in figure 5, in one embodiment, Webpage display device also includes:
Second adjusting module 406, for when getting described operational order, adjust the hierarchical value preset in the corresponding CSS attribute data of mask layer so that presetting mask layer and being adjusted between page main body and sidebar by under page main body, and the transparent Style Attributes in the CSS attribute data of mask layer is adjusted to from invisible.
Further, in one embodiment, the positioning properties preset in the corresponding CSS attribute data of mask layer is stationary positioned, presets the corresponding CSS attribute data of mask layer and also comprises the specially good effect attribute making default mask layer be shown as gradually going out effect.
In one embodiment, sidebar corresponding CSS attribute data comprises makes described sidebar be shown as the specially good effect attribute skidded off from right side, comprises, in the corresponding CSS attribute data of page main body, the specially good effect attribute making page main body be shown as skidding off to the left.
As shown in Figure 6, in one embodiment, Webpage display device also includes:
Detection module 408, for detecting whether get the clicking operation to page main body.
3rd adjusting module 410, if getting the clicking operation to page predeterminable area for detection module 408, then the right property value in corresponding for sidebar CSS attribute data is adjusted to negative predetermined width value by 0, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to 0 by the predetermined width value born, and the hierarchical value in corresponding for default mask layer CSS attribute data is adjusted to it is positioned under page main body and transparent Style Attributes is invisible.
Each technical characteristic of embodiment described above can combine arbitrarily, for making description succinct, the all possible combination of each technical characteristic in above-described embodiment is not all described, but, as long as the combination of these technical characteristics is absent from contradiction, all it is considered to be the scope that this specification is recorded.
Embodiment described above only have expressed the several embodiments of the present invention, and it describes comparatively concrete and detailed, but can not therefore be construed as limiting the scope of the patent. It should be pointed out that, for the person of ordinary skill of the art, without departing from the inventive concept of the premise, it is also possible to making some deformation and improvement, these broadly fall into protection scope of the present invention. Therefore, the protection domain of patent of the present invention should be as the criterion with claims.

Claims (10)

1. a Webpage display packing, it is characterised in that described method includes:
Obtain the operational order triggering display sidebar of input;
According to described operational order, the right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to described negative predetermined width value by 0;
Wherein, the positioning properties in the corresponding CSS attribute data of described sidebar is stationary positioned, and the positioning properties in the corresponding CSS attribute data of described page main body is relative localization.
2. method according to claim 1, it is characterised in that described method also includes:
When getting described operational order, adjust the hierarchical value preset in mask layer corresponding CSS attribute data so that described default mask layer is adjusted between described page main body and described sidebar by under described page main body, and the transparent Style Attributes in the CSS attribute data of described mask layer is adjusted to from invisible.
3. method according to claim 2, it is characterized in that, positioning properties in the corresponding CSS attribute data of described default mask layer is stationary positioned, and described default mask layer corresponding CSS attribute data also comprises the specially good effect attribute making described default mask layer be shown as gradually going out effect.
4. method according to claim 1, it is characterized in that, described sidebar corresponding CSS attribute data comprises makes described sidebar be shown as the specially good effect attribute skidded off from right side, comprises and make described page main body be shown as the specially good effect attribute skidded off to the left in described page main body corresponding CSS attribute data.
5. method according to claim 2, it is characterized in that, described, right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and by the left property value in the page main body corresponding CSS attribute data in webpage by, after 0 step being adjusted to described negative predetermined width value, also including:
Detect whether to get the clicking operation to described page predeterminable area;
If getting the clicking operation to described page main body, then the right property value in corresponding for sidebar CSS attribute data is adjusted to negative predetermined width value by 0, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to 0 by described negative predetermined width value, and the hierarchical value in described default mask layer corresponding CSS attribute data is adjusted to it is positioned under described page main body and described transparent Style Attributes is invisible.
6. a Webpage display device, it is characterised in that described device includes:
Acquisition module, for obtaining the operational order triggering display sidebar of input;
First adjusting module, for according to described operational order, right property value in corresponding for sidebar CSS attribute data is adjusted to 0 by the predetermined width value born, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to described negative predetermined width value by 0;
Wherein, the positioning properties in the corresponding CSS attribute data of described sidebar is stationary positioned, and the positioning properties in the corresponding CSS attribute data of described page main body is relative localization.
7. device according to claim 6, it is characterised in that described device also includes:
Second adjusting module, for when getting described operational order, adjust the hierarchical value preset in mask layer corresponding CSS attribute data so that described default mask layer is adjusted between described page main body and described sidebar by under described page main body, and the transparent Style Attributes in the CSS attribute data of described mask layer is adjusted to from invisible.
8. device according to claim 7, it is characterized in that, positioning properties in the corresponding CSS attribute data of described default mask layer is stationary positioned, and described default mask layer corresponding CSS attribute data also comprises the specially good effect attribute making described default mask layer be shown as gradually going out effect.
9. device according to claim 6, it is characterized in that, described sidebar corresponding CSS attribute data comprises makes described sidebar be shown as the specially good effect attribute skidded off from right side, comprises and make described page main body be shown as the specially good effect attribute skidded off to the left in described page main body corresponding CSS attribute data.
10. device according to claim 7, it is characterised in that described device also includes:
Detection module, for detecting whether get the clicking operation to described page main body;
3rd adjusting module, if getting the clicking operation to described page predeterminable area for described detection module, then the right property value in corresponding for sidebar CSS attribute data is adjusted to negative predetermined width value by 0, and the left property value in the page main body corresponding CSS attribute data in webpage is adjusted to 0 by described negative predetermined width value, and the hierarchical value in described default mask layer corresponding CSS attribute data is adjusted to it is positioned under described page main body and described transparent Style Attributes is invisible.
CN201610074908.6A 2016-02-02 2016-02-02 Web page display method and device Pending CN105677893A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201610074908.6A CN105677893A (en) 2016-02-02 2016-02-02 Web page display method and device

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201610074908.6A CN105677893A (en) 2016-02-02 2016-02-02 Web page display method and device

Publications (1)

Publication Number Publication Date
CN105677893A true CN105677893A (en) 2016-06-15

Family

ID=56303487

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201610074908.6A Pending CN105677893A (en) 2016-02-02 2016-02-02 Web page display method and device

Country Status (1)

Country Link
CN (1) CN105677893A (en)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106201505A (en) * 2016-07-07 2016-12-07 北京京东尚科信息技术有限公司 The display packing of a kind of page and device
CN109375973A (en) * 2018-09-20 2019-02-22 北京城市网邻信息技术有限公司 Page display method, device, computer equipment and computer readable storage medium

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103049172A (en) * 2012-12-20 2013-04-17 北京小米科技有限责任公司 Method, device and terminal of sidebar display
CN104035662A (en) * 2014-05-15 2014-09-10 小米科技有限责任公司 Interface display method, device and terminal
CN104035650A (en) * 2013-03-04 2014-09-10 腾讯科技(深圳)有限公司 Method and device for displaying sidebar information

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103049172A (en) * 2012-12-20 2013-04-17 北京小米科技有限责任公司 Method, device and terminal of sidebar display
CN104035650A (en) * 2013-03-04 2014-09-10 腾讯科技(深圳)有限公司 Method and device for displaying sidebar information
CN104035662A (en) * 2014-05-15 2014-09-10 小米科技有限责任公司 Interface display method, device and terminal

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
JQUERY之家: "如何制作一个炫酷的隐藏侧边栏菜单", 《HTTP://WWW.HTMLEAF.COM/ZILIAOKU/QIANDUANJIAOCHENG/201504171698.HTML》 *

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106201505A (en) * 2016-07-07 2016-12-07 北京京东尚科信息技术有限公司 The display packing of a kind of page and device
CN109375973A (en) * 2018-09-20 2019-02-22 北京城市网邻信息技术有限公司 Page display method, device, computer equipment and computer readable storage medium
CN109375973B (en) * 2018-09-20 2022-09-02 北京城市网邻信息技术有限公司 Page display method and device, computer equipment and computer readable storage medium

Similar Documents

Publication Publication Date Title
US10444961B2 (en) Hover-based interaction with rendered content
US8291348B2 (en) Computing device and method for selecting display regions responsive to non-discrete directional input actions and intelligent content analysis
US10088999B2 (en) Scroll end effects for websites and content
US20190235711A1 (en) Interface information display method and apparatus
CN103473016B (en) Multi-window display method and touch control terminal
WO2022002188A1 (en) Method for displaying multiple windows in split screens, and electronic device
CN108628510B (en) Content display method and device, electronic equipment and readable storage medium
US20130254643A1 (en) Digital Content Enhancement Platform
US10204079B2 (en) Method and apparatus for displaying an extended function information area
CN104035677A (en) Displaying method and device of prompt information
CN103577479B (en) Web page contents display packing and system
CN103513889B (en) A kind of method rapidly inputting multidate information in social network sites
KR20140078629A (en) User interface for editing a value in place
US9317184B2 (en) Providing a configurable menu of hierarchical menu items
KR20160094442A (en) Clicked object magnifying method and apparatus based on floating touch
US9460059B2 (en) Method and apparatus for visualizing the underlying structure of a document using an interactive viewport overlay
CN106681616B (en) Method, device and equipment for displaying function bar of browser
JP2014149860A (en) Information display method of portable multifunctional terminal, information display system using the same, and portable multifunctional terminal
CN105183338A (en) Object processing method
CN102446051A (en) Webpage display adjustment system and display adjustment method thereof
CN105677893A (en) Web page display method and device
CN102385467B (en) Image-based control method, processing method and system
CN106293731B (en) A kind of client software design method to embedded webpage transmitting much information
CN104423862B (en) The methods of exhibiting and device of the functionality controls group of touch screen
CN113434073A (en) Control method and device of active window, electronic equipment and readable storage medium

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20160615