CN114924683A - Split-screen display method, multi-page display method and device for page content - Google Patents

Abstract

The application is applicable to the technical field of computers, and discloses a split-screen display method, a multi-page display method and a device for page content, wherein the split-screen display method displays a first application page, the first application page comprises a first application content area and a split-screen container area, and the first application content area comprises one or more content items so as to split a screen of the application page; the method comprises the steps that an adding operation acting on a content item is responded, the content item is added to a split-screen container area, so that simple adding operation is carried out in the same application page, a series of complicated operations such as new tab creation, re-opening of a content item page, pulling out of a tab and the like are not needed, split-screen display operation of page content is simplified, and operation efficiency is improved; and finally, displaying the content information of the content item in the split-screen container area, so that the content item and the content information are displayed on one application page at the same time, the display effect is improved, the page size does not need to be adjusted manually, and the split-screen display operation is further simplified.

Description

Split-screen display method, multi-page display method and device for page content

technical field

The present application relates to the field of computer technology, and in particular, to a method for displaying page content on a split screen, a method and apparatus for displaying multiple pages.

Background technique

When content items in an application page need to be compared, it is usually necessary to create a new application page to display the content items in the two application pages. At present, a new browser tab is usually opened, and then the content information page under the browser tab is found, and then the tab is dragged out as a separate page window to display the content item page and the content information page at the same time.

However, the current display method needs to open the page by opening a new tab every time, and manually adjust the size of two pages. It can be seen that there is a problem that the operation steps are very complicated in the display mode of the current page content.

SUMMARY OF THE INVENTION

The present application provides a split-screen display method, multi-page display method and device for page content, to solve the technical problem of cumbersome operations in the current page content display method, simplify the page content display operation, and improve the display efficiency and effect of the page content.

In order to solve the above technical problems, in the first aspect, the present application provides a method for displaying page content on a split screen, including:

Displaying a first application page, where the first application page includes a first application content area and a split-screen container area, and the first application content area includes one or more content items;

In response to the add operation acting on the content item, add the content item to the split-screen container area;

In the split-screen container area, the content information of the content item is displayed.

The present application displays a first application page, wherein the first application page includes a first application content area and a split-screen container area, and the first application content area includes one or more content items, so as to split-screen an application page; It acts on the addition operation of content items, and adds content items to the split-screen container area to perform simple addition operations in the same application page, without a series of cumbersome operations such as creating new tabs, reopening content item pages, and dragging out tabs. operation, simplify the split-screen display operation of page content and improve operation efficiency; finally, in the split-screen container area, display the content information of the content item, so as to display the content item and content information on one application page at the same time, improve the display effect, and eliminate the need for manual Adjust the page size to further simplify the split-screen display operation.

In some implementations of the first aspect, the first application page is displayed, including:

Displaying a second application page, where the second application page includes a second application content area, and the second application content area is the first application content area before the split screen of the second application page;

If the split-screen startup event of the second application page is monitored, the split-screen mode of the second application page is activated, and the split-screen mode is used to split the second application page into the first application content area and the split-screen container area, so as to obtain The first application page;

Display the first application page.

In this implementation, on the basis of displaying the second application page of the content item, the second application page is automatically split-screen based on the split-screen mode, which simplifies the display operation and improves the operation efficiency. At the same time, this implementation only splits the page content under the current tab, and does not affect the content display of other tabs. This implementation has better decoupling.

In some implementations of the first aspect, if a split-screen start event of the second application page is monitored, the split-screen mode of the second application page is started, including:

If the split-screen startup event of the second application page is monitored, inserting a split-screen container in the second application page;

Based on the second application content area and the split-screen container, page layout is performed on the second application page to obtain the first application page.

In this implementation, by inserting a split-screen container, the information of the content item can be automatically read by using the container function of the split-screen container; at the same time, the page layout is performed to realize automatic adjustment of the size of each area in the page, and further improve the split-screen efficiency .

In some implementations of the first aspect, based on the second application content area and the split-screen container, page layout is performed on the second application page to obtain the first application page, including:

Based on the preset layout ratio, scaling the size of the second application content area to obtain the first application content area and the blank area of the first application page;

Fill the split-screen container to the blank area to get the split-screen container area.

In this implementation, an automatic screen splitting operation is implemented on the basis of the second application content area through size scaling and filling operations.

In some implementations of the first aspect, the split-screen startup event includes a split-screen startup event triggered based on a preset shortcut instruction.

In this implementation, user operations are simplified and screen splitting efficiency is improved by means of shortcut instructions.

In some implementations of the first aspect, the adding operation is a dragging operation, and in response to the adding operation acting on the content item, adding the content item to the split-screen container area includes:

In response to the drag operation acting on the content item, the content item is dragged to the split-screen container area based on the drag track of the drag operation.

In this implementation, a quick split-screen display is realized based on a drag-and-drop operation, and at the same time, the process of dynamically displaying content items in the split-screen container area can improve user experience.

In some implementations of the first aspect, the drag operation includes a selection operation, a drag operation, and a release operation, and in response to the drag operation acting on the content item, the content item is dragged to the sub-point based on the drag track of the drag operation. screen container area, including:

In response to a selection operation acting on a content item, displaying a zoomed image of the content item;

In response to the drag operation acting on the content item, based on the drag track, drag the zoom image to the split-screen container area;

In response to the release operation on the content item, release the content item in the split-screen container area and cancel the display of the zoomed image.

In this implementation, the zoomed image of the content item is displayed during the dragging operation, so that the user can clearly understand the position of the content item currently being dragged and improve the user's visual effect.

In some implementations of the first aspect, in response to a release operation acting on the content item, releasing the content item in the split-screen container area, and canceling the display of the zoomed image, including:

In response to the release operation acting on the content item, release the content item in the split-screen container area, and trigger the second preset drag event;

Based on the second preset drag event, the display of the zoomed image is canceled.

In this implementation, the second preset drag event is triggered by the release operation, and the corresponding code function is called by the second preset drag event, so as to cancel the display of the zoomed image, make the entire drag operation smoother, and further improve the user experience. experience.

In some implementations of the first aspect, in response to a selection operation acting on the content item, displaying a zoomed image of the content item, including:

In response to the selection operation acting on the content item, record the node element information of the content item;

According to the node element information, a zoomed image corresponding to the node element information is displayed.

In this implementation, the zoom map corresponding to the node element information of the content item is displayed, so that the user can intuitively view the pattern of the zoom map, so as to quickly identify the type of the dragged content item through the pattern.

In some implementations of the first aspect, in response to a selection operation acting on a content item, recording node element information of the content item, including:

triggering the first preset drag event in response to the selection operation acting on the content item;

Based on the first preset drag event, the preset data acquisition function is called to record the node element information of the content item.

In this implementation, by calling the preset data acquisition function to record the node element information of the content item, the content item can be quickly identified from the bottom layer when the drag operation starts; at the same time, the node element information of the content item can be carried during the drag operation. , so as to be able to identify the content item and read the relevant information of the content item according to the node element information before displaying the content information in the subsequent split-screen container area.

In some implementations of the first aspect, a zoomed graph corresponding to the node element information is displayed according to the node element information, including:

Call the preset node copy function, copy the node element information of the content item, and generate new node element information;

Change the style attribute in the updated node element information to generate a zoomed image;

Show zoomed images.

In this implementation, new node element information is generated by copying, and the style attribute is changed, so as to retain the original information of the node element information and ensure the integrity of the relevant information of the content item during the drag and drop operation.

In some implementations of the first aspect, in response to a drag operation acting on the content item, the content item is dragged to the split-screen container area based on the drag track of the drag operation, including:

In response to the drag operation acting on the content item, the content item is dragged based on the drag track;

If it is detected that the content item enters the area of the split-screen container area, the target background color of the split-screen container area is displayed, and the target background color is the first color used to represent the content item allowed to be placed in the The second color of the content item is not allowed in the screen container area;

If the background color is the first color, release the content item to complete the dragging operation.

In this implementation, the background color of the split-screen container area is displayed to intuitively prompt the user whether the current split-screen container area can display content information, so as to cope with the situation where the current drag-and-drop cannot be displayed due to some reasons (for example, the split-screen container is already occupied). It can improve the user experience by removing content items that are dragged without the user's knowledge.

In some implementations of the first aspect, if it is detected that the content item enters the area of the split-screen container area, the target background color of the split-screen container area is displayed, including:

Listen to the third preset drag event;

If it is detected that the third preset drag event is triggered, it is determined that the content item enters the area of the split-screen container area, and the target background color of the split-screen container area is displayed.

In this implementation, the display of the target background color is triggered with the dragging operation through the third preset dragging event during the dragging operation, so that the entire dragging operation is smoother and more intelligent.

In some implementations of the first aspect, in response to the drag operation acting on the content item, based on the drag track of the drag operation, the content item is dragged before the split-screen container area, further comprising:

Add a draggable attribute to the node element of the content item.

In this implementation, the content item can be dragged and dropped by adding a draggable attribute, which is used as the underlying basis for adding content items in the split-screen container area.

In some implementations of the first aspect, in the split-screen container area, the content information of the content item is displayed, including:

Read the first inline style and content information of the content item;

According to the area size of the split-screen container area, adjust the first inline style of the content item to obtain the second inline style;

Based on the second inline style, the content information is displayed in the split-screen container area.

In this implementation, by adjusting the inline style of the content item so that the content information is adapted to the area size of the split-screen container area, the display effect of the content information is improved.

In some implementations of the first aspect, based on the second inline style, after the content information is displayed in the split-screen container area, the method further includes:

Monitor the page window changes of the first application page;

If a change in the page window of the first application page is monitored, window adaptation is performed on the content information in the split-screen container area;

Displays the content information after the window is adapted.

In this implementation, when the page window changes, window adaptation is performed on the content information, so that the content information can be adjusted with the change of the window, and the display effect of the content information is improved.

In some implementations of the first aspect, if a change in the page window of the first application page is monitored, window adaptation is performed on the content information in the split-screen container area, including:

Based on the preset window change function, monitor the page window change of the first application page;

If the change of the page window of the first application page is monitored, the second inline style is adjusted to obtain the third inline style;

Based on the third inline style, the content information is displayed in the split-screen container area.

In this implementation, window adaptation is achieved by adjusting the second inline style.

In some implementations of the first aspect, after reading the first inline style and content information of the content item, the method further includes:

Trigger preset publish and subscribe events;

The first inline style is cached based on a preset publish-subscribe event.

In this implementation, the original inline style of the content item is preserved by caching the first inline style to ensure data integrity; at the same time, because under a first application page, there may be multiple content items and a few split-screen containers (such as one or two), when the split-screen mode is turned off, the split-screen container needs to find the content item of the first application content area, and the search method is very inefficient, so this implementation uses the method of publishing and subscribing events, The split-screen container is decoupled from the content item corresponding to the content information, so that the content item can be quickly restored to the first application content area. At the same time, for another split-screen display of the same content item, it can also be quickly displayed according to the cached first inline style, without having to adjust the first inline style again.

In some implementations of the first aspect, based on the second inline style, after the content information is displayed in the split-screen container area, the method further includes:

If the split screen closing event of the first application page is monitored, the inline style of the content item is restored based on the first inline style.

In this implementation, content item restoration is performed based on the first inline style in the publish-subscribe event to improve restoration efficiency.

In a second aspect, the present application provides a method for displaying multiple pages, including:

Acquiring multiple target application pages, each target application page includes an application content area and a split-screen container area, the application content area contains one or more content items, and the split-screen container area displays content information of the content items;

Reflow multiple target application pages;

Show multiple target app pages after reflow.

The present application rearranges multiple target application pages whose page content has been rearranged and displayed, so that multiple target application pages can be displayed at the same time, so that the display process of the page content of each target application page does not affect each other, so that the page content Split-screen display is more abundant.

In a third aspect, the present application provides a split-screen display device for page content, including:

a first display module, configured to display a first application page, the first application page includes a first application content area and a split-screen container area, and the first application content area includes one or more content items;

Add a module for adding the content item to the split-screen container area in response to the adding operation acting on the content item;

The second display module is used for displaying the content information of the content item in the split-screen container area.

In a fourth aspect, the present application provides a multi-page display device, including:

an acquisition module, used for acquiring multiple target application pages, each target application page includes an application content area and a split-screen container area, the application content area contains one or more content items, and the split-screen container area displays content information of the content items;

The rearrangement module is used to rearrange multiple target application pages;

The third display module is used to display the rearranged multiple target application pages.

In a fifth aspect, the present application provides a terminal device, including a processor and a memory, where the memory is used to store a computer program, and when the computer program is executed by the processor, the method for displaying page content in a split screen according to the first aspect, or the second aspect is implemented. multi-page display method.

In a sixth aspect, the present application provides a computer-readable storage medium, which stores a computer program, and when the computer program is executed by a processor, implements the split-screen display method for page content in the first aspect, or the multi-page display in the second aspect. method.

In a seventh aspect, the present application provides a computer program product that, when the computer program product runs on a terminal device, enables the terminal device to implement the steps in each of the above methods when executed.

It should be noted that, for the beneficial effects of the third aspect to the seventh aspect, please refer to the relevant description of the first aspect or the second aspect, which will not be repeated here.

Description of drawings

1 is a schematic flowchart of a method for displaying page content in a split screen according to an embodiment of the present application;

FIG. 2 is a schematic flowchart of a specific flow of step S101 shown in an embodiment of the present application;

FIG. 3 is a schematic diagram of a specific flow of step S102 shown in an embodiment of the present application;

FIG. 4 is a schematic flowchart of a specific flow of step S103 shown in an embodiment of the present application;

5 is a schematic diagram of a second application page shown in an embodiment of the present application;

6 is a schematic diagram of a second application page after the split-screen mode is activated according to an embodiment of the present application;

7 is a schematic diagram of a first application page shown in an embodiment of the present application;

8 is a schematic diagram of an application scenario of the method for displaying page content on a split screen according to an embodiment of the present application;

9 is a schematic flowchart of a method for displaying multiple pages according to an embodiment of the present application;

10 is a schematic structural diagram of a split-screen display device for page content according to an embodiment of the application;

11 is a schematic structural diagram of a multi-page display device according to an embodiment of the application;

FIG. 12 is a schematic structural diagram of a terminal device according to an embodiment of the application.

Detailed ways

The technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the drawings in the embodiments of the present application. Obviously, the described embodiments are only a part of the embodiments of the present application, but not all of the embodiments. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative work fall within the protection scope of the present application.

As recorded in the related art, the current display mode of page content has a problem that the operation steps are very cumbersome. For example, in the document verification scenario of the financial system, it is necessary to compare the document information entered in the financial system with the document diagram. The current display method is usually to open a new browser tab, find the document graph page under the browser tab, and then drag out the tab as a separate page window to display the document information and document graph page of the financial system at the same time. , so as to check the documents. However, this display method needs to open the page by opening a new tab every time, and needs to manually adjust the size of the two pages.

To this end, an embodiment of the present application provides a split-screen display method for page content, by displaying a first application page, wherein the first application page includes a first application content area and a split-screen container area, and the first application content area includes one or more A plurality of content items are used to split an application page; in response to an adding operation acting on the content items, the content items are added to the split-screen container area to perform simple operations in the same application page. Adding operations does not require a series of cumbersome operations such as creating new tabs, reopening content item pages, and dragging tabs, simplifying the split-screen display operation of page content and improving operation efficiency; finally, in the split-screen container area, display the The content information of the content item, so that the content item and content information can be displayed on one application page at the same time, which improves the display effect, and eliminates the need to manually adjust the page size, further simplifying the split-screen display operation.

Please refer to FIG. 1 , which is a schematic flowchart of a method for displaying page content on a split screen according to an embodiment of the present application. The split-screen display method for page content in the embodiments of the present application may be applied to terminal devices, where the terminal devices include but are not limited to devices such as smart phones, notebook computers, tablet computers, and desktop computers. As shown in FIG. 1 , the split-screen display method for page content in this embodiment includes steps S101 to S103, which are described in detail as follows:

Step S101 , displaying a first application page, where the first application page includes a first application content area and a split-screen container area, and the first application content area includes one or more content items.

In this step, the terminal device is provided with or externally connected with a display unit, and the display unit includes but is not limited to a display screen and a projector. The terminal device displays a first application page on the display unit, and the first application page may be an application page loaded based on a browser, such as an application page when accessing the financial system based on a browser.

Optionally, the first application content area is the display area of the content item, and the content item is the content item on the application page loaded by the terminal device, such as the purchase contract page of the financial system, and the contract number on the purchase contract page is the content. item. It can be understood that the content item may be a document object model (Document Object Model, DOM) node of the browser, and the content item can be manipulated by adding operational attributes to the node elements of the DOM node.

Optionally, the split-screen container area is an area where the split-screen container is located, and the split-screen container is used to read content information of the content item and display the content information, which may be a preset browser plug-in.

Exemplarily, in one embodiment, a split-screen container is inserted into a blank tab of the browser, the application page of the blank tab is split into a split-screen container area and a blank application content area, and The application content area loads the application content to obtain the application content area, thereby displaying the application page including the application content area and the split-screen container area. In another implementation manner, a split-screen container is inserted into the application page where the application content has been loaded in the browser, and the application page is split into a split-screen container area and an application content area displaying the application content, so as to display the application content area and the application content area. The app page in the split-screen container area.

Step S102, in response to the adding operation acting on the content item, add the content item to the split-screen container area.

In this step, adding operations include but are not limited to single-click operations, multi-click operations (eg, double-click operations, triple-click operations), and drag and drop operations. Exemplarily, in an implementation manner, the terminal device moves the content item to the split-screen container area in response to the user's operation of clicking the content item by long-pressing the mouse and moving the mouse. In another implementation manner, the terminal device sends the content item to the split-screen container area in response to the user's operation of double-clicking the content item through the touchable screen.

Optionally, when an adding operation is performed on a content item, the adding operation carries node element information of the content item, so that the split-screen container can read the content information of the content item according to the node element information. Optionally, when an adding operation is performed on a content item, the adding operation carries content information and node element information of the content item, so that the split-screen container obtains the content information.

Step S103: Display the content information of the content item in the split-screen container area.

In this step, the content information is specific information of the content item, for example, the content item is a contract item, and the content information may be a contract table. Exemplarily, the content information of the content item is read according to the node element information of the content item added to the split-screen container area; the content information is displayed in the split-screen container area based on a preset display manner.

It should be noted that, compared with the current related art, this embodiment can simultaneously display content items and content information on one application page, improve the display effect, and eliminate the need to manually adjust the page size, simplify the split-screen display operation, and improve the operation efficiency. At the same time, the first application page and other application pages in this embodiment do not affect each other, and smooth switching between multiple application pages can still be performed.

In some embodiments, based on the embodiment shown in FIG. 1 , FIG. 2 shows a schematic flowchart of step S101 provided by the embodiment of the present application. It should be noted that the steps that are the same as those in FIG. 1 will not be repeated here. As shown in FIG. 2, step S101 includes steps S201 to S203, which are described in detail as follows:

Step S201 , displaying a second application page, where the second application page includes a second application content area, and the second application content area is the first application content area before the screen split of the second application page.

Step S202, if a split-screen startup event of the second application page is monitored, a split-screen mode of the second application page is started, and the split-screen mode is used to split the second application page into the split-screen mode of the second application page. the first application content area and the split-screen container area to obtain the first application page.

Step S203, displaying the first application page.

In this embodiment, the split-screen startup event is a computer event for starting the split-screen mode, which may be a system event or a user event. Optionally, the split-screen start event includes a user event triggered based on a preset shortcut instruction. Preset shortcut commands include but are not limited to voice commands, remote control commands, mouse commands and keyboard commands. Exemplarily, the shortcut instruction is a keyboard shortcut key combination instruction, such as ctrl+shift+←.

In one embodiment, when the second application page is displayed, the keyboard shortcut key combination instruction is monitored based on a function (such as addEventListener) for listening to events and processing the corresponding events, when "ctrl+shift+←" is triggered, Then, it is determined that a split-screen startup event of the second application page is monitored.

The second application page is an application page in a normal browsing mode. The split-screen mode may be a functional plug-in embedded in the browser. When the split-screen mode is activated, the functional plug-in automatically splits the second application page.

Exemplarily, FIG. 5 shows a schematic diagram of a second application page, FIG. 6 shows a schematic diagram of a second application page after the split screen mode is activated, and FIG. 7 shows a schematic diagram of a first application page. As shown in FIG. 5 , the entire document page is the second application content area; as shown in FIG. 6 , the second application page in FIG. 5 is divided into a reduced size second application content area and a split-screen container area. After being added to the split-screen container area, the first application page shown in FIG. 7 is obtained.

In some embodiments, the step S202 includes:

If the split-screen startup event of the second application page is monitored, inserting a split-screen container in the second application page;

Based on the second application content area and the split-screen container, page layout is performed on the second application page to obtain the first application page.

In this embodiment, the split-screen container is used to read content information of a content item and display the content information. Exemplarily, after the split-screen container is inserted into the second application page, a split-screen container area is generated on the second application page; and the area sizes of the split-screen container area and the second application content area are adjusted to obtain the first layout completed. application page.

In some embodiments, the page layout step includes:

Based on a preset layout ratio, scaling the second application content area to obtain the first application content area and blank area of the first application page;

Filling the split-screen container to the blank area to obtain the split-screen container area.

In this embodiment, the preset layout ratio is the size ratio of the second application content area to the split-screen container area. For example, if the preset layout ratio is 1:1, the second application content area and the split-screen container area each occupy half of the first application page. Exemplarily, taking 1:1 as the preset layout ratio, scaling the document page shown in FIG. 5 to obtain the first application content area and the blank area, and embedding the split-screen container into the blank area, as shown in FIG. 6 . The second application content area in split-screen mode.

It can be understood that the preset layout ratio can be determined based on the content items and content information to be displayed in actual situations. For example, if the user wishes to mainly view the content information, the ratio of the split-screen container area can be increased.

In some embodiments, based on the embodiment shown in FIG. 1 , FIG. 3 shows a schematic flowchart of step S102 provided by the embodiment of the present application. It should be noted that the steps that are the same as those in FIG. 1 will not be repeated here. As shown in FIG. 3, step S102 specifically includes step S301, which is described in detail as follows:

Step S301, in response to a drag operation acting on the content item, drag the content item to the split-screen container area based on the drag track of the drag operation.

In this embodiment, the dragging operation is a computer operation that is added to the browser node based on a computer language, and the computer language includes but is not limited to javascript and html, and html may specifically be html5. The drag track is the movement track of the screen focus after the drag operation is triggered, and the screen focus may be the mouse position or the touch screen position of the touchable screen user.

Optionally, a draggable attribute is added to the node element of the content item, and the node element includes but is not limited to a field layout panel, an advanced panel, a collapsible flex panel, an attachment, a tab, and the like. Exemplarily, the draggable attribute Draggable is added to the DOM node element corresponding to the content item based on html5, for example: <div draggable="true"></div>.

In some embodiments, the drag operation includes a selection operation, a drag operation and a release operation, and the step S301 includes:

In response to a selection operation acting on the content item, displaying a zoomed image of the content item;

In response to the drag operation acting on the content item, based on the drag track, drag the zoom image to the split-screen container area;

In response to the release operation acting on the content item, the content item is released in the split-screen container area, and the zoomed image is canceled.

In this embodiment, the selection operation may be a selection operation triggered by a user's click operation, the drag operation may be a drag operation triggered by a user's long-press and move operations, and the release operation may be a drag operation triggered by the user's release of a long-press operation . The zoom map can be a zoom map of content information or a preset pattern of a content item. For example, if the content information is a contract table, the zoomed image is a scaled image of the contract table. The zoomed image may be a reduced image (or a thumbnail image) or an enlarged image.

In some embodiments, for the selection operation, including:

In response to the selection operation acting on the content item, recording node element information of the content item;

According to the node element information, a zoomed image corresponding to the node element information is displayed.

In this embodiment, the node element information is DOM node element information of the content item, the DOM node element information includes scale attribute information, and the scale attribute information can be used to set the inline style of the node element. Exemplarily, when the selection operation is triggered, the DOM node element information of the content item is read and recorded, and the inline style of the content item is modified by modifying the scale attribute information in the DOM node element information, so as to generate and display a zoomed image. the goal of.

It can be understood that, by recording node element information of content items, the split-screen container can also distinguish different content items under the same application page, so that the process of adding content items to the split-screen container is more accurate.

Optionally, the step of recording node element information includes:

triggering a first preset drag event in response to a selection operation acting on the content item;

Based on the first preset drag event, a preset data acquisition function is called to record node element information of the content item.

In this optional embodiment, the first preset drag event may be an OnDragstart event, and the preset data acquisition function may be dataTransfer.setData. Exemplarily, an OnDragstart event is added to the content item based on html5, and when the user clicks on the content item, the OnDragstart event is triggered to call dataTransfer.setData to record the key and type of the content item.

Optionally, for the step of displaying the zoomed image, it includes:

Call the preset node copy function, copy the node element information of the content item, and generate new node element information;

changing the style attribute in the new node element information to generate the zoomed image;

The zoomed image is displayed.

In this embodiment, the preset node copy function may be a cloneNode function, and the style attribute is a scale attribute. Exemplarily, the node element information is copied based on the cloneNode function, and dataTransfer.setDragImage is used to reduce the scale attribute to 0.3 times the original to reduce the style attribute, so as to achieve the purpose of generating a scaled image.

In some embodiments, for the release operation, including:

In response to the release operation acting on the content item, the content item is released in the split-screen container area, and a second preset drag event is triggered;

Based on the second preset drag event, the zoomed image is canceled.

In this embodiment, the second preset drag event may be an Ondragend event. Exemplarily, an Ondragend event is added to the content item based on html5, and when the mouse button is released, the Ondragend event is triggered, and the zoomed image displayed during the dragging process is removed.

In some embodiments, the step S301 includes:

In response to the drag operation acting on the content item, drag the content item based on the drag track;

If it is detected that the content item enters the area of the split-screen container area, the target background color of the split-screen container area is displayed, and the target background color is used to indicate that the content item is allowed to be placed in the split-screen container area. The first color of , or the second color used to represent that the split-screen container area does not allow content items to be placed;

If the background color is the first color, release the content item to complete the dragging operation.

In this embodiment, because the split-screen container may not be able to display other content items due to some reasons (for example, the split-screen container is already occupied), in order to avoid the user from continuously performing drag and drop operations without knowing it, in this embodiment, the content item is not displayed. When entering the split-screen container area, the user is prompted with the target background color of the available status of the current split-screen container to improve user experience.

Optionally, the steps for displaying the target background color include:

Listen to the third preset drag event;

If it is detected that the third preset drag event is triggered, it is determined that the content item enters the area of the split-screen container area, and the target background color of the split-screen container area is displayed.

In this optional embodiment, the third preset drag event may be an OnDragEnter event. Exemplarily, an OnDragEnter event is added to the split-screen container based on html5, and the display of the target background color of the split-screen container is triggered by monitoring the OnDragEnter event to indicate the current available state of the split-screen container.

In some embodiments, based on the embodiment shown in FIG. 1 , FIG. 4 shows a schematic flowchart of step S103 provided by the embodiment of the present application. It should be noted that the steps that are the same as those in FIG. 1 will not be repeated here. As shown in FIG. 4 , step S103 includes steps S401 to S403, which are described in detail as follows:

Step S401, read the first inline style and content information of the content item;

Step S402, adjusting the first inline style of the content item according to the area size of the split-screen container area to obtain a second inline style;

Step S403, displaying the content information in the split-screen container area based on the second inline style.

In this embodiment, the inline style is an inline style, which is applied to a node element only once, so as to facilitate quick switching of content split screens under the same application page. Exemplarily, the inline style is the style style attribute in the node element information, and the style style attribute includes information such as position, left, top, width, and height. By modifying the style style, the first inline style is adjusted to obtain the second inline style.

In some embodiments, on the basis of the embodiment shown in FIG. 4 , after step S403, the method further includes:

monitoring the page window change of the first application page;

If a change in the page window of the first application page is monitored, window adaptation is performed on the content information of the split-screen container area;

The content information after the window is adapted is displayed.

In this embodiment, since the first application page is a browser page, it can be changed based on the change of the browser window. Therefore, in order to improve the display effect, the content information is also changed with the change of the window (ie, the window is adaptive). .

Optionally, the window adaptation step includes:

Based on the preset window change function, monitor the page window change of the first application page;

If a change in the page window of the first application page is monitored, the second inline style is adjusted to obtain a third inline style;

Based on the third inline style, the content information is displayed in the split-screen container area.

In this optional embodiment, the preset window change function may be a ResizeObserve function. Exemplarily, ResizeObserve is used to monitor the change of the fenp window of the page, and when the window changes, the style (width, height, left) is changed, so that the content information in the split-screen container can also follow the change when the window changes.

In some embodiments, on the basis of the embodiment shown in FIG. 4 , after the step S401, the method further includes:

triggering the preset publish-subscribe event;

Based on the preset publish-subscribe event, the first inline style is cached.

In this embodiment, the preset publish-subscribe event is a computer event implemented based on a publish/subscribe mechanism. Optionally, when the first inline style and content information of the content item are read, a publish-subscribe event is triggered, wherein the split-screen container is the publisher and the content item is the subscriber, that is, the split-screen container is published to read the content item. the first inline style and content information, the content item caches the first inline style through an asynchronous callback.

This embodiment adopts publish-subscribe events to support simple broadcast communication, and when the state of an object changes, the subscribed objects are automatically notified. The coupling between the publisher and the subscriber is reduced. The publisher only publishes the message and does not need to care about how the message is used by the subscriber. The subscriber only needs to listen to the publisher's message.

It can be understood that, after the first inline style is adjusted, the cached first inline style is updated by the adjusted first inline style. For example, after the first inline style is adjusted to the second inline style, the first inline style is updated by using the second inline style, that is, the second inline style is used as the new first inline style.

Optionally, after the step S403, it further includes:

If the split screen closing event of the first application page is monitored, the inline style of the content item is restored based on the first inline style.

In this optional embodiment, the split-screen closing event is a computer event for closing the split-screen mode, which may be a system event or a user event. Optionally, the split screen closing event includes a user event triggered based on a preset shortcut instruction. Preset shortcut commands include but are not limited to voice commands, remote control commands, mouse commands and keyboard commands. Exemplarily, the shortcut instruction is a keyboard shortcut key combination instruction, such as ctrl+shift+←.

In one embodiment, when the first application page is displayed, the keyboard shortcut key combination instruction is monitored based on a function (such as addEventListener) for listening to events and processing corresponding events. When "ctrl+shift+←" is triggered, Then it is determined that the split screen closing event of the first application page is monitored.

It should be noted that this embodiment also combines the preset distribution subscription event, and uses the first inline style of the preset distribution subscription event to restore the content item, thereby improving restoration efficiency and accuracy.

As an example and not a limitation, FIG. 8 shows a schematic flowchart of an application scenario of the method for displaying page content on a split screen provided by an embodiment of the present application.

As shown in Figure 8, enter the document page and use AddEventListener to monitor the shortcut key (ctrl+shift+←) to monitor whether the split screen mode is enabled. If the shortcut key is monitored, the split-screen mode is activated on the document page, and the document area and the split-screen container area are displayed, in which the default document area and the split-screen container area each occupy 50% of the width.

Among them, when the split-screen mode is enabled, a draggable attribute (Draggable) is added to the DOM node element where the content items of the current document page (such as field layout panel, advanced panel, collapsible flex panel, attachment and tab) are located. The pseudo code is: <div draggable="true"></div>; and adding a first drag event (OnDragstart) and a second drag event (OnDragend). The pseudo code is: <div >

When you start to drag a content item (that is, select a content item), trigger the OnDragstart event, use the dataTransfer.setData function to record the key and type of the current content item, and use the cloneNode function to copy the DOM node element information of the current content item, and use dataTransfer. The setDragImage function sets the zoom image when dragging: use the dataTransfer.setDragImage(Element) function to set a custom image, Element is the DOM node element on the page, modify the scale attribute of the node element to reduce it to 0.3 times the original, so as to achieve The effect of zooming the graph.

When the content item is dragged into the area of the split-screen container, the OnDragEnter event of the split-screen container is triggered, and the target background color of the split-screen container is displayed to indicate the available status of the current split-screen container.

After releasing the content item, trigger the OnDragend event to call the dataTransfer.getData function to obtain the key and type of the currently placed content item, and trigger the corresponding publish-subscribe event (the publisher is the split-screen container, and the subscriber is the content module). In the subscriber event callback, the inline style style of the current content item is cached, and the position, left, top, width and height in the style style of the current content item are modified, so that the content information of the content item can be stored in the split-screen container. The effect of adaptive display. Use the ResizeObserve function to monitor the change of the fenp window of the current application page. When the window changes, adjust the corresponding style (width, height, left) according to the window change to achieve window adaptation.

When the split-screen mode starts, if the shortcut key (ctrl+shift+←) is monitored again, the split-screen mode is turned off, and the style of the content item is restored based on the inline style style cached in the distributed subscription event, so that the content item can be restored to document page.

It should be noted that, compared with the current related split-screen technologies, the present application has the following scene characteristics:

1. The content split screen only affects the content of the current tab, and the exclusive mode is still reserved for other tabs, and the split screen does not affect the content display of other pages. For example, if one tab contains a page A with split screen based on the above method, and another tab contains a page B split based on the above method, the split screen content of different application pages can be displayed by switching the tabs.

2. Combined with business scenarios, some prefabricated split-screen content can be directly combined and displayed to the content items in the business scenario, and even the demands of customizing products and pages according to user habits can be achieved. For example, for some document pages, some users are accustomed to inputting separately, and some users are accustomed to piecing together related input. This application, by caching the inline style, directly displays the corresponding form (such as piecing together) when the page is opened next time. form or separate form).

FIG. 9 is a schematic flowchart of a method for displaying multiple pages according to an embodiment of the present application. The multi-page display method in the embodiment of the present application can be applied to terminal devices, where the terminal devices include but are not limited to devices such as smart phones, notebook computers, tablet computers, and desktop computers. As shown in FIG. 9 , the multi-page display method of this embodiment includes steps S901 to S903, which are described in detail as follows:

Step S901: Acquire multiple target application pages, each of the target application pages includes an application content area and a split-screen container area, the application content area includes one or more content items, and the split-screen container area displays the content information of the content item;

Step S902, rearranging a plurality of the target application pages;

Step S903, displaying the rearranged multiple target application pages.

In this embodiment, the target application page is an application page obtained by performing a split-screen display method based on the above-mentioned page content display method. The rearrangement can be the split screen function that comes with the terminal device.

Exemplarily, there is a page A (including the application content area a1 and the split-screen container area a2) split-screen based on the above method in one tab, and a page B (including the application content area a1 and the split-screen container area a2) is split based on the above method in another tab. Application content area b1 and split-screen container area b2), using the split-screen function of the terminal device to display page A and page B at the same time, finally, the application content area a1 and the split-screen container area a2 can be simultaneously displayed under one display screen. , the application content area b1, and the split-screen container area b2.

It can be understood that, for the split-screen process of the target application page, reference may be made to the description of the split-screen display method of the page content, which will not be repeated here.

In order to implement the split-screen display method of page content corresponding to the above method embodiments, corresponding functions and technical effects can be achieved. Referring to FIG. 10 , FIG. 10 shows a structural block diagram of a split-screen display apparatus for page content provided by an embodiment of the present application. For the convenience of description, only the parts related to this embodiment are shown. The split-screen display device for page content provided by the embodiment of this application includes:

a first display module 1001, configured to display a first application page, where the first application page includes a first application content area and a split-screen container area, and the first application content area includes one or more content items;

The adding module 1002 is configured to add the content item to the split-screen container area in response to an adding operation acting on the content item;

The second display module 1003 is configured to display the content information of the content item in the split-screen container area.

In some embodiments, the first presentation module 1001 includes:

The first display sub-module is used to display a second application page, the second application page includes a second application content area, and the second application content area is the first application before the screen split of the second application page content area;

A startup submodule, configured to start a split-screen mode of the second application page if the split-screen startup event of the second application page is monitored, and the split-screen mode is used to split the second application page into a screen for the first application content area and the split-screen container area to obtain the first application page;

The second display sub-module is configured to display the first application page.

In some embodiments, the promoter module includes:

an inserting unit, configured to insert a split-screen container in the second application page if a split-screen startup event of the second application page is monitored;

A layout unit, configured to perform page layout on the second application page based on the second application content area and the split-screen container to obtain the first application page.

In some embodiments, the layout unit includes:

a scaling subunit, configured to scale the size of the second application content area based on a preset layout ratio to obtain the first application content area and blank area of the first application page;

The filling subunit is used for filling the split-screen container into the blank area to obtain the split-screen container area.

In some embodiments, the split-screen startup event includes a split-screen startup event triggered based on a preset shortcut instruction.

In some embodiments, the adding operation is a dragging operation, and the adding module 1002 includes:

A dragging sub-module is configured to, in response to a dragging operation acting on the content item, drag the content item to the split-screen container area based on the dragging track of the dragging operation.

In some embodiments, the drag operation includes a selection operation, a drag operation and a release operation, and the drag submodule includes:

a selection unit, configured to display a zoomed image of the content item in response to a selection operation acting on the content item;

a dragging unit, configured to, in response to a dragging operation acting on the content item, drag the zoomed image to the split-screen container area based on the dragging track;

A release unit, configured to release the content item in the split-screen container area in response to a release operation acting on the content item, and cancel the display of the zoomed image.

In some embodiments, the release unit includes:

a first release subunit, configured to release the content item in the split-screen container area in response to a release operation acting on the content item, and trigger a second preset drag event;

The canceling subunit is configured to cancel the display of the zoomed image based on the second preset drag event.

In some embodiments, the selecting unit includes:

a recording subunit, configured to record the node element information of the content item in response to the selection operation acting on the content item;

The first display subunit is configured to display, according to the node element information, a zoomed image corresponding to the node element information.

In some embodiments, the recording subunit is specifically used for:

triggering a first preset drag event in response to a selection operation acting on the content item;

Based on the first preset drag event, a preset data acquisition function is called to record node element information of the content item.

In some embodiments, the first display subunit is specifically used for:

Call the preset node copy function, copy the node element information of the content item, and generate new node element information;

changing the style attribute in the new node element information to generate the zoomed image;

The zoomed image is displayed.

In some embodiments, the dragging unit includes:

a dragging subunit, used for dragging the content item based on the dragging track in response to the dragging operation acting on the content item;

The second display subunit is configured to display the target background color of the split-screen container area if it is detected that the content item enters the area of the split-screen container area, where the target background color is used to represent the The first color of the content item allowed to be placed in the split-screen container area, or the second color used to indicate that the split-screen container area is not allowed to place the content item;

The second release subunit is configured to release the content item if the background color is the first color to complete the drag operation.

In some embodiments, the second display subunit is specifically used for:

Listen to the third preset drag event;

If it is detected that the third preset drag event is triggered, it is determined that the content item enters the area of the split-screen container area, and the target background color of the split-screen container area is displayed.

In some embodiments, the dragging submodule further includes:

An adding unit is used to add a draggable attribute to the node element of the content item.

In some embodiments, the second presentation module 1003 includes:

a reading submodule for reading the first inline style and content information of the content item;

an adjustment sub-module for adjusting the first inline style of the content item according to the area size of the split-screen container area to obtain a second inline style;

The third display sub-module is configured to display the content information in the split-screen container area based on the second inline style.

In some embodiments, the second presentation module 1003 further includes:

a monitoring submodule for monitoring the page window change of the first application page;

an adaptive submodule, configured to perform window adaptation on the content information of the split-screen container area if a change in the page window of the first application page is monitored;

The fourth display sub-module is used for displaying the content information after the window is adapted.

In some embodiments, the adaptive sub-module includes:

a monitoring unit, configured to monitor the page window change of the first application page based on a preset window change function;

an adjustment unit, configured to adjust the second inline style to obtain a third inline style if a change in the page window of the first application page is monitored;

A display unit, configured to display the content information in the split-screen container area based on the third inline style.

In some embodiments, the second presentation module 1003 further includes:

a triggering submodule for triggering the preset publish-subscribe event;

A caching submodule, configured to cache the first inline style based on the preset publish-subscribe event.

In some embodiments, the second presentation module 1003 further includes:

A restore sub-module, configured to restore the inline style of the content item based on the first inline style if the split screen closing event of the first application page is monitored.

The above-mentioned multi-page display apparatus can implement the multi-page display method of the above method embodiment. The options in the foregoing method embodiment are also applicable to this embodiment, and are not described in detail here. For the remaining contents of the embodiments of the present application, reference may be made to the contents of the foregoing method embodiments, which will not be repeated in this embodiment.

In order to implement the multi-page display method corresponding to the above method embodiments, corresponding functions and technical effects can be achieved. Referring to FIG. 11 , FIG. 11 shows a structural block diagram of a multi-page display apparatus provided by an embodiment of the present application. For the convenience of description, only the parts related to this embodiment are shown. The multi-page display device provided by the embodiment of this application includes:

The acquiring module 1101 is configured to acquire multiple target application pages, each of the target application pages includes an application content area and a split-screen container area, the application content area contains one or more content items, and the split-screen container area displays there is content information for the content item;

A rearrangement module 1102, configured to rearrange a plurality of the target application pages;

The third display module 1103 is configured to display the rearranged multiple target application pages.

The above-mentioned multi-page display apparatus can implement the multi-page display method of the above method embodiment. The options in the foregoing method embodiment are also applicable to this embodiment, and are not described in detail here.

FIG. 12 is a schematic structural diagram of a terminal device provided by an embodiment of the present application. As shown in FIG. 12 , the terminal device 12 of this embodiment includes: at least one processor 120 (only one is shown in FIG. 12 ), a processor, a memory 121 , and a processor stored in the memory 121 and available for processing in the at least one processor The computer program 122 running on the processor 120, the processor 120 implements the steps in any of the above method embodiments when the computer program 122 is executed.

The terminal device 12 may be a computing device such as a smart phone, a notebook computer, a tablet computer, and a desktop computer. The terminal device may include, but is not limited to, the processor 120 and the memory 121 . Those skilled in the art can understand that FIG. 12 is only an example of the terminal device 12, and does not constitute a limitation on the terminal device 12. It may include more or less components than the one shown, or combine some components, or different components , for example, may also include input and output devices, network access devices, and the like.

The so-called processor 120 may be a central processing unit (Central Processing Unit, CPU), and the processor 120 may also be other general-purpose processors, digital signal processors (Digital Signal Processors, DSP), application specific integrated circuits (Application Specific Integrated Circuits) , ASIC), off-the-shelf programmable gate array (Field-Programmable Gate Array, FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. A general purpose processor may be a microprocessor or the processor may be any conventional processor or the like.

The memory 121 may be an internal storage unit of the terminal device 12 in some embodiments, such as a hard disk or a memory of the terminal device 12 . In other embodiments, the memory 121 may also be an external storage device of the terminal device 12, such as a plug-in hard disk, a smart memory card (Smart Media Card, SMC), a secure digital (Secure Digital, SD) card, flash memory card (Flash Card) and so on. Further, the memory 121 may also include both an internal storage unit of the terminal device 12 and an external storage device. The memory 121 is used to store an operating system, an application program, a boot loader (Boot Loader), data, and other programs, such as program codes of the computer program, and the like. The memory 121 may also be used to temporarily store data that has been output or will be output.

In addition, an embodiment of the present application further provides a computer-readable storage medium, where the computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, implements the steps in any of the foregoing method embodiments.

The embodiments of the present application provide a computer program product, which, when the computer program product runs on a terminal device, enables the terminal device to implement the steps in each of the foregoing method embodiments.

In the several embodiments provided in this application, it should be understood that each block in the flowchart or block diagram may represent a module, program segment or part of code, and the module, program segment or part of code includes One or more executable instructions for implementing specified logical functions. It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved.

If the functions are implemented in the form of software function modules and sold or used as independent products, they can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present application can be embodied in the form of a software product in essence, or the part that contributes to the prior art or the part of the technical solution. The computer software product is stored in a storage medium, including Several instructions are used to make a terminal device execute all or part of the steps of the methods described in the various embodiments of the present application. The aforementioned storage medium includes: U disk, mobile hard disk, Read-Only Memory (ROM, Read-Only Memory), Random Access Memory (RAM, Random Access Memory), magnetic disk or optical disk and other media that can store program codes .

The specific embodiments described above further describe the purpose, technical solutions and beneficial effects of the present application in detail. It should be understood that the above are only specific embodiments of the present application, and are not intended to limit the protection scope of the present application. . It is particularly pointed out that for those skilled in the art, any modifications, equivalent replacements, improvements, etc. made within the spirit and principles of the present application should be included within the protection scope of the present application.

Claims (14)

1. A method for displaying page contents in a split screen manner is characterized by comprising the following steps:

displaying a first application page, the first application page comprising a first application content area and a split-screen container area, the first application content area containing one or more content items;

adding the content item to the split-screen container area in response to an adding operation that acts on the content item;

and displaying the content information of the content item in the split-screen container area.

2. The method for displaying page content in a split screen manner according to claim 1, wherein the displaying the first application page comprises:

displaying a second application page, wherein the second application page comprises a second application content area, and the second application content area is the first application content area before the second application page is split;

if a split screen starting event of the second application page is monitored, starting a split screen mode of the second application page, wherein the split screen mode is used for splitting the second application page into the first application content area and the split screen container area to obtain the first application page;

and displaying the first application page.

3. The method for split-screen presentation of page content according to claim 1, wherein the adding operation is a drag operation, and the adding the content item to the split-screen container region in response to the adding operation being performed on the content item comprises:

and in response to the drag operation on the content item, dragging the content item to the split-screen container area based on a drag track of the drag operation.

4. The method for displaying page content in a split screen manner according to claim 3, wherein the dragging operation includes a selecting operation, a dragging operation, and a releasing operation, and the dragging the content item to the split-screen container area based on a dragging track of the dragging operation in response to the dragging operation applied to the content item includes:

presenting a zoom map of the content item in response to a selection operation acting on the content item;

dragging the zoom map of the content item to the split-screen container area based on the dragging track in response to a dragging operation acting on the content item;

and in response to the release operation acting on the content item, releasing the content item in the split-screen container area, and canceling the display of the zoom map.

5. The method for displaying page content in a split screen manner according to claim 4, wherein the displaying the zoom map of the content item in response to the selection operation acting on the content item comprises:

responding to the selection operation acted on the content item, and recording node element information of the content item;

and displaying a zoom graph corresponding to the node element information according to the node element information.

6. The method for displaying page content in a split screen manner according to claim 5, wherein the displaying the zoom map corresponding to the node element information according to the node element information comprises:

calling a preset node copying function, copying the node element information of the content item, and generating new node element information;

changing the style attribute in the new node element information to generate the zoom map;

the zoom map is shown.

7. The method for displaying page content in a split screen manner according to claim 3, wherein the dragging the content item to the split screen container area based on a drag track of the drag operation in response to the drag operation on the content item comprises:

dragging the content item based on the drag trajectory in response to a drag operation that acts on the content item;

if the content item is monitored to enter the area range of the split-screen container area, displaying a target background color of the split-screen container area, wherein the target background color is a first color for representing that the split-screen container area allows the content item to be placed, or a second color for representing that the split-screen container area does not allow the content item to be placed;

and if the background color is the first color, releasing the content item to finish the dragging operation.

8. The method for displaying the split screen of the page content according to claim 1, wherein said displaying the content information of the content item in the split screen container area comprises:

reading a first inline style and content information of the content item;

adjusting a first inline style of the content item according to the area size of the split-screen container area to obtain a second inline style;

displaying the content information in the split-screen container region based on the second inline style.

9. The method for split-screen presentation of page content according to claim 8, wherein, after the split-screen container region presents the content information based on the second inline style, further comprising:

and if the split screen closing event of the first application page is monitored, restoring the inline style of the content item based on the first inline style.

10. A multi-page display method is characterized by comprising the following steps:

the method comprises the steps that a plurality of target application pages are obtained, each target application page comprises an application content area and a split-screen container area, the application content area comprises one or more content items, and content information of the content items is displayed in the split-screen container area;

rearranging the target application pages;

and displaying the rearranged multiple target application pages.

11. A device for displaying page contents in a split screen manner, comprising:

a first presentation module for presenting a first application page, the first application page including a first application content area and a split-screen container area, the first application content area containing one or more content items;

an adding module, configured to add the content item to the split-screen container region in response to an adding operation that is performed on the content item;

and the second display module is used for displaying the content information of the content item in the split-screen container area.

12. A multi-page display device, comprising:

the system comprises an acquisition module, a display module and a display module, wherein the acquisition module is used for acquiring a plurality of target application pages, each target application page comprises an application content area and a split-screen container area, the application content area comprises one or more content items, and the split-screen container area displays content information of the content items;

the rearrangement module is used for rearranging the target application pages;

and the third display module is used for displaying the rearranged multiple target application pages.

13. A terminal device, characterized in that it comprises a processor and a memory for storing a computer program which, when executed by the processor, implements the method for split-screen presentation of page content according to any one of claims 1 to 9, or the method for multi-page presentation according to claim 10.

14. A computer-readable storage medium, characterized in that it stores a computer program which, when executed by a processor, implements the method for split-screen presentation of page content according to any one of claims 1 to 9, or the method for multi-page presentation according to claim 10.

Images