CN108319683B - Web page display method, device and terminal - Google Patents

Abstract

A web page display method, device and terminal. The method includes: displaying a web page; displaying a video playing area on the upper layer of the web page; when there is target page content with drawing requirements in the web page, drawing the target page content on the upper layer of the web page and hiding the video playing area. In the embodiment of the present application, when a video playback area is displayed on the upper layer of the webpage, if there is target page content that needs to be drawn and displayed on the webpage, the above target page content is drawn and displayed on the webpage, and By hiding the video play area, the content of the target page will not be blocked after the video play area is hidden, so that the user can completely view the content of the above target page, and the overall display performance is improved.

Description

Web page display method, device and terminal

technical field

The embodiments of the present application relate to the technical field of browsers, and in particular, to a web page display method, device, and terminal.

Background technique

With the development of browser technology, the functions of the browser are also increasingly powerful. For example, the current browser usually has a video playback function.

In the related art, when a user watches a video through a browser, in order to provide a consistent viewing experience for videos provided by different webpages, the browser usually takes over the playing of the video. Specifically, the browser creates a video node after receiving the play instruction, renders and draws the video play area on the upper layer of the webpage according to the Cascading Style Sheets (CSS) attribute of the video node, and then plays the video in the video play area. video.

SUMMARY OF THE INVENTION

Embodiments of the present application provide a web page display method, device, and terminal. The technical solution is as follows:

On the one hand, an embodiment of the present application provides a web page display method, the method includes:

Displaying a web page, the web page contains video content;

Displaying a video playing area on the upper layer of the webpage, the video playing area is a display area for playing the video content;

When there is target page content with drawing requirements in the webpage, the target page content is drawn on the upper layer of the webpage, and the video playing area is hidden.

On the other hand, an embodiment of the present application provides a webpage display device, and the device includes:

a page display module, used to display a web page, the web page contains video content;

an area display module, configured to display a video playing area on the upper layer of the web page, where the video playing area is a display area for playing the video content;

The page display module is further configured to draw the target page content in the webpage when there is a target page content with a drawing requirement in the webpage;

The hiding module is used to hide the video playing area.

In another aspect, an embodiment of the present application provides a terminal, the terminal includes a processor and a memory, the memory stores a computer program, and the computer program is loaded and executed by the processor to implement the web page described in the above aspect Display method.

In another aspect, an embodiment of the present application provides a computer-readable storage medium, where a computer program is stored in the computer-readable storage medium, and the computer program is loaded and executed by a processor to implement the web page display method described in the above aspect .

The technical solutions provided in the embodiments of the present application can bring the following beneficial effects:

By displaying the video playing area on the upper layer of the web page, if there is target page content that needs to be drawn in the web page, draw the above target page content in the web page, hide the video playing area, and hide the video playing area. After being hidden, the content of the target page will not be blocked, so that the user can completely view the content of the target page, and the overall display performance is improved.

Description of drawings

1 is a schematic interface diagram of a web page display method provided by the related art;

2 is a flowchart of a web page display method provided by an embodiment of the present application;

Fig. 3 is the interface schematic diagram involved in the embodiment shown in Fig. 2;

4 is a flowchart of a web page display method provided by another embodiment of the present application;

FIG. 5 is a block diagram of a webpage display device provided by an embodiment of the present application;

FIG. 6 is a schematic structural diagram of a terminal provided by an embodiment of the present application.

Detailed ways

In order to make the objectives, technical solutions and advantages of the present application clearer, the embodiments of the present application will be further described in detail below with reference to the accompanying drawings.

In the related art, when there is a target web page content that needs to be displayed on the upper layer of the web page, the target web page content will be blocked by the video playback area, so that the user cannot fully view the target web page content, and thus cannot interact with the target web page content. interact with web content. 1, which shows a schematic interface diagram of a web page display method provided by the related art, the web page 10 includes a navigation control 12, and the upper layer of the web page 10 displays a video playback area 11. After the user triggers the navigation control 12, The web page 10 includes the next-level page content 13 corresponding to the navigation control 12 , wherein the next-level page content 13 corresponding to the navigation control 12 is blocked by the video playing area 11 .

The embodiments of the present application provide a web page display method, device, and terminal. When a video playback area is displayed on the upper layer of the web page, if there is target page content that needs to be drawn on the web page, the above-mentioned content is drawn on the web page. The content of the target page is hidden, and the video playback area is hidden. After the video playback area is hidden, the content of the target page will not be blocked, so that the user can completely view the content of the target page, and the overall display performance is improved.

In this embodiment of the present application, the execution subject of each step may be a terminal. Exemplarily, the above-mentioned terminal may be an electronic device such as a mobile phone, a tablet computer, an e-book reader, a multimedia playing device, a personal computer (Personal Computer, PC).

Optionally, a browser is installed and run in the terminal, and the execution body of each step may be the browser. The browser refers to a kind of software that can display the content of a Hyper Text Markup Language (HTML) file of a web server or a file system, and allow a user to interact with the content of the file. Exemplarily, the browser may be a Firefox (Firefox) browser, a Google (Chrome) browser, an Opera (Opera) browser, a UC browser, and the like.

For the convenience of description, in the following method embodiments, only a browser is used as an example for the execution subject of each step for description, but this is not a limitation.

FIG. 2 is a flowchart of a web page display method provided by an embodiment of the present application. The method may include the following steps.

Step 201, displaying a web page.

A web page is a display page corresponding to a web page file, and the web page file may include an HTML file, a CSS style file, a view file, and the like. The HTML file is used to configure the page content included in the web page, the CSS style file is used to configure the presentation form of the web page, and the view file is used to configure the structure of the page content in the web page. Web pages usually include text, pictures, audio, video and other content. In this embodiment of the present application, the web page includes video content.

In some embodiments of the present application, the browser sends a page access request carrying a Uniform Resource Locator (URL) to the server according to a trigger instruction of the user, the server returns a web page file corresponding to the URL, and the browser receives The web page file is then parsed and rendered, and then the web page corresponding to the web page file is displayed.

Step 202, displaying a video playing area on the upper layer of the webpage.

The video playback area is a display area for playing video content. In addition to displaying the video content, the video playing area can also be used to display related operation controls for the user to control the video playing. The above-mentioned related operation controls include a pause control, a volume adjustment control, a brightness adjustment control, a fast forward control, and the like, which are not limited in this embodiment of the present application.

In some embodiments of the present application, after receiving a playback instruction corresponding to the video content, the browser displays a video playback area on the upper layer of the web page. The play instruction is triggered by the user and is used to trigger the browser to play the video content. Exemplarily, the play instruction is a click signal corresponding to the video content received by the browser. Specifically, the process for the browser to display the video playback area after receiving the playback instruction is as follows: the browser creates a video node, renders the above-mentioned video node, and then displays the video node on the webpage according to the style of the video node included in the preset style file. The upper layer of the draws the video playback area.

Step 203 , when there is target page content with a drawing requirement in the webpage, draw the target page content in the webpage, and hide the video playing area.

The drawing requirement refers to the requirement for drawing on the webpage. The content of the target page may be a UI element that can be used for interactive operations by the user, such as a login popup window, a search popup window, a navigation bar, etc., which is not limited in this embodiment of the present application. In some embodiments of the present application, after the browser receives a trigger instruction corresponding to the displayed page content in the web page, there is target page content with drawing requirements in the web page, and the target page content is displayed by the above-mentioned The content of the page calls out the displayed content.

In some embodiments of the present application, hiding the video playback area may be implemented in the following manners.

In the first possible implementation, the browser sets the visual property of the video playback area to hidden. Visual properties are used to specify whether page content is visible or hidden. The visual property can be represented by css visibility, and the value of css visibility can be any one of visible (visible), hidden (hidden), collapse (collapse) and inherit (inherit the css visibility of the parent class); among them, when the page content When the value of the css visibility is hidden, or, when the value of the css visibility of the page content is inherit, and the value of the cssvisibility of the parent class of the page content is hidden, the page content is hidden at this time.

In the second possible implementation manner, the browser sets the display property of the video playback area to be empty. Display attributes are used to specify the display form of page content. The display attribute can be represented by display, and the value of display can be none (empty), block (block display), inline (inline display), etc. Among them, when the value of display is none, the page content will not be displayed at this time.

In a third possible implementation manner, the browser sets the background of the video playback area to be transparent. In some embodiments of the present application, when the browser sets the transparency of the background of the video playback area to 0, the background of the video playback area is transparent, and the user cannot view the video playback area.

In other possible implementation manners, the browser can also hide the video playing area by calling the hide function. For example, the above hidden function may be a set Visibility(View.GONE) method or a setVisibility(View.UNVISIBILITY) method.

When the video playback is controlled by the browser, the video playback area is usually located on the upper layer of the web page, and part of the page content in the web page may be blocked by the video playback area. Therefore, in this embodiment of the present application, after determining the target page content with drawing requirements, the browser hides the video play area, so that the page content covered by the video play area can be directly displayed to the user.

Referring to FIG. 3 in conjunction with FIG. 3 , it shows a schematic diagram of an interface displayed by a web page according to an exemplary embodiment of the present application. A video playback area 31 is displayed on the upper layer of the web page 30, and part of the page content 32 is displayed in the area of the web page 30 not covered by the video playback area 31. After the user clicks the above page content 32, there is a drawing demand in the web page 30. Therefore, the browser draws the target page content 33 in the web page 30, and hides and displays the video playing area 31.

It should be noted that the embodiment of the present application does not limit the execution order of displaying the content of the target page on the upper layer of the webpage and hiding the video playing area. The browser can first display the target page content on the upper layer of the web page, and then hide the video playback area; it can also hide the video playback area first, and then display the target page content on the upper layer of the web page; it can also display the target page content on the upper layer of the web page. while hiding the video playback area.

In some embodiments of the present application, when the video playback area is hidden, the browser pauses to play the video content, that is, during the process of the video playback area being hidden, the progress of the video content watched by the user remains unchanged to avoid video playback. When the area is hidden, the browser continues to play the video content, causing the user to miss the above-mentioned continued playing of the video content.

To sum up, in the method provided by the embodiments of the present application, in the case where a video playing area is displayed on the upper layer of the web page, if there is target page content that needs to be drawn in the web page, the above target page is drawn in the web page. The content of the target page is hidden, and the video play area is hidden. After the video play area is hidden, the content of the target page will not be blocked, so that the user can completely view the content of the target page, and the overall display performance is improved.

In addition, the video content is paused while the video playback area is hidden, so as to avoid the situation that the browser continues to play the video content when the video playback area is hidden, causing the user to miss the video content.

FIG. 4 is a flowchart of a web page display method provided by another embodiment of the present application. The method may include the following steps.

Step 401, displaying a web page.

Web pages contain video content.

Step 402: Display a video playing area on the upper layer of the webpage.

The video playback area is a display area for playing video content.

Step 403 , when there is target page content with drawing requirements in the webpage, obtain the visible attribute of the target page content.

The visible property of the target page content is used to indicate whether the user can see the target page content. Visible properties include visible and invisible. When the visible attribute of the target page content is visible, the user can see the target page content at this time; when the visible attribute of the target page content is invisible, the user cannot see the target page content at this time.

The visible attribute can be determined by the visual attribute and display attribute of the target page content. In the embodiment of the present application, the browser can directly read the visual attribute and display attribute of the target page content from the style file corresponding to the target page content, and then obtain the visible attribute of the target page content. In addition, for the explanation of the visualization attribute and the display attribute, reference may be made to step 203, which will not be repeated here.

Step 404, when the visible attribute of the target page content indicates that the target page content is visible, obtain the display level of the target page content.

When the visible property of the target page content is not hidden and the display property of the target page content is not empty, the visible property of the target page content is visible. When the visible property of the target page content is hidden, or, when the display property of the target page content is empty, the visible property of the target page content is invisible.

The display level is used to indicate the order in which the page content is displayed in the web page. The display hierarchy can be represented in z-order. The larger the value of the z-order of the page content, the higher the display level of the page content in the web page; the smaller the value of the z-order of the page content, the lower the display level of the page content in the web page. Generally speaking, the content of a page with a large z-order usually overwrites the content of a page with a small z-order. In addition, the z-order of each page content is also stored in the style file, and the browser can directly read the z-order of the target page content to determine the display level of the target page content.

Step 405 , if the display level of the target page content is greater than the maximum display level of the displayed page content in the web page, detect whether the target page content has a background.

When the display level of the target page content is greater than the maximum display level of the displayed page content on the web page, the target page content should be displayed in the frontmost order in the web page; When the maximum display level of the page content of the target page is reached, the display order of the target page content in the web page is not the frontmost.

In some embodiments of the present application, if the display level of the target page content is greater than the maximum display level of the displayed page content in the webpage, the browser directly executes the rendering of the target page content in the webpage, and hides the video playback area steps. In other embodiments of the present application, when the display level of the target page content is greater than the maximum display level of the displayed page content in the webpage, the browser further determines whether the target page content has a background to determine whether to execute the The step of drawing the content of the target page in the webpage and hiding the video playing area.

The background of the target page content is used to specify the color, layout, special effects, etc. of the target page content. The browser can directly detect whether the style file of the content of the target page includes a background, and then determine whether the content of the target page has a background.

Step 406, if the target page content has a background, obtain the overlapping area of the target page content and the video playing area.

If the browser includes background in the style file that detects the content of the target page, it determines that the content of the target page has a background, and if the browser does not include background in the style file that detects the content of the target page, it determines that the content of the target page does not have a background.

The area of the overlapping portion of the target page content and the video playing area refers to the area occupied by the overlapping portion between the target page content and the video playing area. Optionally, the style file includes the Rect of the target page content and the Rect of the video playback area. The Rect of the target page content includes the vertex coordinates, length and width of the upper left corner of the target page content; the Rect of the video playback area includes the vertex coordinates, length and width of the upper left corner of the video playback area. After the browser reads the Rect of the target page content and the Rect of the video playback area, it calculates the length and width of the overlapped part of the target page content and the video playback area, and then calculates the overlapped area of the target page content and the video playback area.

In some embodiments of the present application, when the content of the target page has a background, the browser directly executes the steps of drawing the content of the target page in the webpage and hiding the video playing area. In other embodiments of the present application, after determining that the target page content has a background, the browser further judges whether the area of the overlapped portion of the target page content and the video playback area conforms to a preset condition, so as to determine whether to execute the execution in the web page. The step of drawing the content of the target page and hiding the video playing area.

Step 407: Detect whether the area of the overlapped portion meets a preset condition.

The preset condition may be set according to actual experience, which is not limited in this embodiment of the present application. Exemplarily, the preset condition is that the area of the overlapping portion reaches a preset value. The preset value may also be set according to actual requirements, which is not limited in this embodiment of the present application.

In some embodiments of the present application, step 407 may include the following sub-steps:

Step 407a, calculating the area ratio of the overlapping area in the target page content;

Step 407b, detecting whether the area ratio is greater than a preset threshold;

Step 407c, if the area ratio is greater than the preset threshold, it is determined that the area of the overlapped portion meets the preset condition.

The area ratio of the area of the overlapping part to the content of the target page refers to the ratio between the area of the overlapping part and the area of the content of the target page. For example, the area of the overlapping portion is 150, and the area of the target page content is 240. At this time, the area of the overlapping portion accounts for 150/240=62.5% of the target page content.

The preset threshold may be set according to actual experience, which is not limited in this embodiment of the present application. For example, the preset threshold is 70%. If the area ratio is less than or equal to the preset threshold, it is determined that the area of the overlapping portion does not meet the preset condition.

In order to make the content of the target page as clear and complete as possible for the user to view, in this embodiment of the present application, the ratio of the area of the overlapped part to the content of the target page is used to determine whether the area of the overlapped part meets the preset condition.

Step 408 , if the area of the overlapping portion meets the preset condition, draw the content of the target page in the webpage and hide the video playing area.

In some embodiments of the present application, when the video playing area is hidden, the browser pauses playing the video content.

If the area of the overlapping portion does not meet the preset condition, the browser does not perform the steps of drawing the target display content in the webpage and hiding the video playing area.

It should be noted that, in this embodiment of the present application, the browser sequentially determines whether the visible attribute of the target page content indicates that the target page content is visible, and determines whether the display level of the target page content is greater than the maximum display level of the displayed page content in the webpage. level, determine whether the target page content has a background, determine whether the overlapping area of the target page content and the video playback area meets the preset conditions, and determine whether the browser needs to execute the rendering of the target display content in the web page and hide the video playback area. step. In other embodiments, the above judgment step may also have other execution sequences, which are not limited in this embodiment of the present application.

Step 409 , when the content of the target page is canceled from being displayed, or when a call-out instruction corresponding to the video playing area is received, the video playing area is displayed.

In this embodiment of the present application, after the browser hides the playing video area, it can also redisplay the video playing area under a specific trigger condition.

In a possible implementation manner, when the content of the target page is cancelled, the browser displays the video playing area. In one example, after the browser receives the interactive operation signal corresponding to the content of the target page, the content of the target page is canceled from being displayed. For example, the content of the target page is a login pop-up window. If the user completes the login operation, the login pop-up window will be canceled. In another example, after the browser receives a cancel operation signal corresponding to the content of the target page, the content of the target page is canceled from being displayed. For example, the content of the target page is a search pop-up window, and the upper left corner of the search pop-up window displays an operation control "×" for canceling the display of the search pop-up window. When the browser receives a trigger signal corresponding to "×", it cancels the display of the search pop-up window. window.

In another possible implementation manner, when receiving a call-out instruction corresponding to the video play area, the browser displays the video play area. The call-out instruction is triggered by the user and is used to trigger the browser to redisplay the video playback area. In one example, when the user triggers a blank area in the web page, the browser receives a call-out instruction corresponding to the video playing area.

In some embodiments of the present application, when the video playing area is displayed, the video content continues to be played from the paused position. The video content played by the browser after the video playback area is displayed may be the same or different from the video content played before the video playback area is hidden. If the video content played by the browser after the video playback area is displayed is the same as the video content played before the video playback area is hidden, the browser will continue to play the video content from the paused position when the video playback area is displayed, so as to prevent the user from missing part of the video The playback process of the content.

To sum up, in the method provided by the embodiments of the present application, in the case where a video playing area is displayed on the upper layer of the web page, if there is target page content that needs to be drawn in the web page, the above target page is drawn in the web page. The content of the target page is hidden, and the video play area is hidden. After the video play area is hidden, the content of the target page will not be blocked, so that the user can completely view the content of the target page, and the overall display performance is improved.

In addition, it is also judged whether it needs to be executed on the webpage by taking into account the visible attributes of the target page content, the display level of the target page content, whether the target page content has a background, and the area of the overlapping part between the target page content and the video playback area. The step of drawing the content of the target page and hiding the video play area in the step of avoiding the situation of hiding the video play area under unnecessary circumstances.

In addition, when the video playback area is displayed, the video content is automatically resumed from the paused position, and the user does not need to perform manual operation, thereby improving the playback efficiency.

The following are apparatus embodiments of the present application, which can be used to execute the method embodiments of the present application. For details not disclosed in the device embodiments of the present application, please refer to the method embodiments of the present application.

Please refer to FIG. 5 , which shows a block diagram of a webpage display apparatus provided by an embodiment of the present application. The apparatus has the function of implementing the above method example, and the function may be implemented by hardware or by executing corresponding software by hardware. The apparatus may include: a page display module 501 , an area display module 502 and a hiding module 503 .

The page display module 501 is configured to display a web page, and the web page contains video content.

The area display module 502 is configured to display a video playing area on the upper layer of the webpage, where the video playing area is a display area for playing the video content.

The page display module 501 is further configured to draw the target page content in the web page when there is target page content with a drawing requirement in the web page.

The hiding module 503 is used to hide the video playing area.

To sum up, in the device provided by the embodiments of the present application, when a video playing area is displayed on the upper layer of the webpage, if there is target page content that needs to be displayed on the upper layer of the webpage, the content of the target page that needs to be displayed on the upper layer of the webpage is displayed on the upper layer of the webpage. The content of the above target page is hidden, and the video play area is hidden. After the video play area is hidden, the content of the target page will not be blocked, so that the user can completely view the content of the above target page, and the overall display performance is improved.

In an optional embodiment provided based on the embodiment of FIG. 5 , the apparatus further includes: an attribute acquisition module and a level acquisition module (not shown in the figure).

The attribute obtaining module is configured to obtain the visible attribute of the target page content when there is target page content with drawing requirements in the webpage.

A level acquisition module, configured to acquire the display level of the target page content when the visible attribute of the target page content indicates that the target page content is visible.

The page display module 501 is further configured to execute the drawing of the target page in the webpage if the display level of the target page content is greater than the maximum display level of the displayed page content in the webpage page. content steps.

The hiding module 503 is further configured to execute the step of hiding the video playing area if the display level of the target page content is greater than the maximum display level of the displayed page content in the webpage page.

In some embodiments of the present application, the apparatus further includes: a background detection module, an area acquisition module and a condition detection module (not shown in the figure).

The background detection module is configured to detect whether the target page content has a background if the display level of the target page content is greater than the maximum display level of the page content displayed in the webpage page.

An area acquisition module, configured to acquire the area of the overlapping portion of the target page content and the video playing area if the target page content has the background.

A condition detection module is used to detect whether the area of the overlapping portion meets a preset condition.

The page display module 501 is further configured to execute the step of drawing the content of the target page in the webpage if the area of the overlapping portion meets the preset condition.

The hiding module 503 is further configured to execute the step of hiding the video playing area if the area of the overlapping portion meets the preset condition.

In some embodiments of the present application, the condition detection module is used for:

Calculate the area ratio of the overlapping portion area in the target page content;

Detecting whether the area ratio is greater than a preset threshold;

If the area ratio is greater than the preset threshold, it is determined that the area of the overlapping portion meets the preset condition.

In another optional embodiment provided based on the embodiment in FIG. 5 , the hiding module 503 is configured to:

setting the visual property of the video playback area to be hidden;

or,

setting the display attribute of the video playback area to be empty;

or,

The background of the video playing area is set to be transparent.

In another optional embodiment provided based on the embodiment of FIG. 5, the area display module 502 is further configured to cancel the display of the target page content, or when receiving a call-out instruction corresponding to the video playback area , the video playback area is displayed.

In some embodiments of the present application, the apparatus further includes: a playback module (not shown in the figure).

The playing module is configured to pause the playing of the video content when the video playing area is hidden.

The playing module is further configured to continue playing the video content from the paused position when the video playing area is displayed.

It should be noted that, when the device provided in the above embodiment realizes its functions, only the division of the above functional modules is used as an example for illustration. The internal structure is divided into different functional modules to complete all or part of the functions described above. In addition, the apparatus and method embodiments provided in the above embodiments belong to the same concept, and the specific implementation process thereof is detailed in the method embodiments, which will not be repeated here.

Referring to FIG. 6, it shows a structural block diagram of a terminal provided by an exemplary embodiment of the present application. The terminal in this application may include one or more of the following components: a processor 610 and a memory 620 .

Processor 610 may include one or more processing cores. The processor 610 uses various interfaces and lines to connect various parts in the entire terminal, and executes the terminal's operation by running or executing the instructions, programs, code sets or instruction sets stored in the memory 620, and calling the data stored in the memory 620. Various functions and processing data. Optionally, the processor 610 may employ at least one of digital signal processing (Digital Signal Processing, DSP), field-programmable gate array (Field-Programmable Gate Array, FPGA), and programmable logic array (Programmable Logic Array, PLA). implemented in hardware. The processor 610 may integrate one or a combination of a central processing unit (Central Processing Unit, CPU), a modem, and the like. Among them, the CPU mainly handles the operating system and application programs; the modem is used to handle wireless communication. It can be understood that, the above-mentioned modem may not be integrated into the processor 610, but is implemented by a single chip.

Optionally, when the processor 610 executes the program instructions in the memory 620, the web page display method provided by each of the foregoing method embodiments is implemented.

The memory 620 may include random access memory (Random Access Memory, RAM), or may include read-only memory (Read-Only Memory). Optionally, the memory 620 includes a non-transitory computer-readable storage medium. Memory 620 may be used to store instructions, programs, codes, sets of codes, or sets of instructions. The memory 620 may include a stored program area and a stored data area, wherein the stored program area may store an instruction for implementing an operating system, an instruction for at least one function, an instruction for implementing each of the above method embodiments, and the like; the storage data area Data and the like created according to the use of the terminal can be stored.

The above-mentioned structure of the terminal is only illustrative. In actual implementation, the terminal may include more or less components, such as a display screen, etc., which is not limited in this embodiment.

Those skilled in the art can understand that the structure shown in FIG. 6 does not constitute a limitation on the terminal 600, and may include more or less components than the one shown, or combine some components, or adopt different component arrangements.

In an exemplary embodiment, a computer-readable storage medium is also provided, and a computer program is stored in the computer-readable storage medium, and the computer program is loaded and executed by the processor of the terminal to implement the above method embodiments. of the various steps.

In an exemplary embodiment, a computer program product is also provided, when the computer program product is executed, it is used to implement the functions of the various steps in the above method embodiments.

It should be understood that references herein to "a plurality" means two or more. "And/or", which describes the association relationship of the associated objects, means that there can be three kinds of relationships, for example, A and/or B, which can mean that A exists alone, A and B exist at the same time, and B exists alone. The character "/" generally indicates that the associated objects are an "or" relationship.

The above-mentioned serial numbers of the embodiments of the present application are only for description, and do not represent the advantages or disadvantages of the embodiments.

The above are only exemplary embodiments of the present application and are not intended to limit the present application. Any modifications, equivalent replacements, improvements, etc. made within the spirit and principles of the present application shall be included in the protection of the present application. within the range.

Claims (9)

1. A method for displaying a web page, the method comprising:

displaying a webpage, wherein the webpage comprises video content;

in response to receiving a playing instruction corresponding to the video content, displaying a video playing area on an upper layer of the webpage, wherein the video playing area is a display area for playing the video content;

when target page content with drawing requirements exists in the webpage, drawing the target page content in the webpage, and hiding the video playing area, so that the target page content is not shielded after the video playing area is hidden; the target page content is a user interface element which is called out and can be used for a user to carry out interactive operation after a trigger instruction is received through the displayed page content in the webpage;

in response to the video playing area being in a hidden state, pausing playing the video content;

and responding to the cancellation of the display of the target page content, displaying the video playing area, and continuing to play the video content from the pause position.

2. The method of claim 1, further comprising:

when target page content with drawing requirements exists in the webpage, acquiring visible attributes of the target page content;

when the visible attribute of the target page content indicates that the target page content is visible, acquiring a display level of the target page content;

and if the display level of the target page content is greater than the maximum display level of the displayed page content in the webpage, executing the steps of drawing the target page content in the webpage and hiding the video playing area.

3. The method of claim 2, further comprising:

if the display level of the target page content is larger than the maximum display level of the displayed page content in the webpage, detecting whether the target page content has a background;

if the target page content has the background, acquiring the area of the overlapped part of the target page content and the video playing area;

detecting whether the area of the overlapped part meets a preset condition or not;

and if the area of the overlapped part meets the preset condition, the steps of drawing the target page content in the webpage and hiding the video playing area are executed.

4. The method according to claim 3, wherein the detecting whether the area of the overlapped part meets a preset condition comprises:

calculating the area ratio of the overlapping part area in the target page content;

detecting whether the area ratio is larger than a preset threshold value or not;

and if the area occupation ratio is larger than the preset threshold, determining that the area of the overlapped part meets the preset condition.

5. The method according to any of claims 1 to 4, wherein the hiding the video playing area comprises:

setting the visual attribute of the video playing area to be hidden;

or,

setting the display attribute of the video playing area to be null;

or,

and setting the background of the video playing area to be transparent.

6. The method according to any one of claims 1 to 4, wherein after hiding the video playing area, further comprising:

and when the target page content is canceled from being displayed, or when an outgoing call instruction corresponding to the video playing area is received, displaying the video playing area.

7. A web page display apparatus, characterized in that the apparatus comprises:

the page display module is used for displaying a webpage, and the webpage contains video content;

the area display module is used for responding to a received playing instruction corresponding to the video content and displaying a video playing area on the upper layer of the webpage, wherein the video playing area is a display area used for playing the video content; the page display module is further used for drawing the target page content in the webpage when the target page content with drawing requirements exists in the webpage, wherein the target page content is a user interface element which is called out and can be used for a user to carry out interactive operation after a trigger instruction is received through the displayed page content in the webpage;

the hiding module is used for hiding the video playing area so as to enable the video playing area not to shield the content of the target page after being hidden;

the playing module is used for responding to the situation that the video playing area is in a hidden state and pausing playing of the video content;

the playing module is further configured to respond to the target page content to cancel display, display the video playing area, and continue playing the video content from a pause position.

8. A terminal, characterized in that it comprises a processor and a memory, said memory storing a computer program that is loaded and executed by said processor to implement the web page display method according to any one of claims 1 to 6.

9. A computer-readable storage medium, in which a computer program is stored, the computer program being loaded and executed by a processor to implement the web page display method according to any one of claims 1 to 6.

Images