CN112905925A - Method, system, equipment and storage medium for displaying prompt box - Google Patents

Method, system, equipment and storage medium for displaying prompt box Download PDF

Info

Publication number
CN112905925A
CN112905925A CN202110171045.5A CN202110171045A CN112905925A CN 112905925 A CN112905925 A CN 112905925A CN 202110171045 A CN202110171045 A CN 202110171045A CN 112905925 A CN112905925 A CN 112905925A
Authority
CN
China
Prior art keywords
parent element
prompt box
target title
width
displaying
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN202110171045.5A
Other languages
Chinese (zh)
Other versions
CN112905925B (en
Inventor
孟露
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Second Hand Artificial Intelligence Technology Co ltd
Original Assignee
Beijing Second Hand Artificial Intelligence Technology Co ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Beijing Second Hand Artificial Intelligence Technology Co ltd filed Critical Beijing Second Hand Artificial Intelligence Technology Co ltd
Priority to CN202110171045.5A priority Critical patent/CN112905925B/en
Publication of CN112905925A publication Critical patent/CN112905925A/en
Application granted granted Critical
Publication of CN112905925B publication Critical patent/CN112905925B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/957Browsing optimisation, e.g. caching or content distillation
    • G06F16/9577Optimising the visualization of content, e.g. distillation of HTML documents
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Software Systems (AREA)
  • Data Mining & Analysis (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

The invention provides a method, a system, equipment and a storage medium for displaying a prompt box, wherein the method comprises the following steps: when detecting that a mouse pointer slides over a target title in a webpage, acquiring parent elements of the target title and the width of a frame of the target title; acquiring a first interval and a second interval between a target title in the parent element and a frame of the parent element based on the style of the parent element, and acquiring the actual width of the parent element according to the width of the frame, the first interval and the second interval; filling a target title into the span label based on the created span label, and displaying the filled span label in a webpage to obtain the width of the target title; and comparing the actual width of the parent element with the width of the target title, and displaying the target title based on the prompt box according to the comparison result. The method automatically does not show the prompt box when the complete content is shown, and can automatically show the prompt box when the complete content is not shown, thereby realizing reasonable display of the prompt box and reducing the display redundancy degree of the prompt box.

Description

Method, system, equipment and storage medium for displaying prompt box
Technical Field
The invention relates to the technical field of internet, in particular to a method, a system, equipment and a storage medium for displaying a prompt box.
Background
At present, the prompt box at the Web end is frequently used, and can be used under the situation of buttons or characters, when a mouse pointer slides, the prompt box can prompt the characters or display the complete content of only partial characters on a page, so that the space is saved, the user can obtain complete information, and the use degree is higher.
At present, in the prior art, a prompt box is displayed in one mode through a tooltip component which is defaulted by a system; another way is to do the prompt box presentation by a third party plug-in or reset tooltip component.
However, in the prior art, the style of the prompt box in the first mode is not easy to change, different designs and implementations cannot be performed according to different scenes, and the position of the prompt box is fixed, so that the requirements sometimes cannot be met; the second mode is beautiful in style and convenient to adjust, but can not be displayed through a prompt box when the whole content can be displayed, so that the second mode is redundant and unreasonable.
Disclosure of Invention
In order to solve the technical problems of high display redundancy degree and low rationality of the prompt box in the prior art, the invention provides a prompt box display method, which can automatically display the prompt box when complete content is displayed, and automatically display the prompt box when the complete content is not displayed, thereby realizing reasonable display of the prompt box and reducing the display redundancy degree of the prompt box.
The invention provides a prompt box display method, which comprises the following steps:
a parent element obtaining step, wherein when a mouse pointer is detected to slide through a target title in a webpage, a parent element of the target title and the width of a frame of the parent element are obtained;
a parent element actual width calculation step, namely acquiring a first distance between the target title in the parent element and a frame of the parent element and a second distance between the target title in the parent element and the frame of the parent element based on the style of the parent element, and calculating to obtain the actual width of the parent element according to the frame width, the first distance and the second distance;
a target title width calculation step, wherein the target title is filled into the span label based on the created span label, and the filled span label is displayed in the webpage, so that the width of the target title is obtained;
and a prompt box display step, namely comparing the actual width of the parent element with the width of the target title, and displaying the target title based on the prompt box according to the comparison result.
The method for displaying the prompt box, wherein the method for calculating the actual width of the parent element in the step of calculating the actual width of the parent element specifically includes:
calculating a sum of the first pitch and the second pitch;
and subtracting the sum value from the width of the frame to calculate the actual width of the parent element.
The method for displaying the prompt box comprises the following steps:
when the width of the target title is larger than the actual width of the parent element, displaying the target title based on the prompt box;
when the width of the target title is smaller than or equal to the actual width of the parent element, the target title does not need to be displayed based on the prompt box.
The method for displaying the prompt box further comprises the following steps:
and a prompt box creating step, wherein a tooltip component is set according to a preset style, the prompt box is created through the tooltip component, and the target title is displayed based on the prompt box.
The method for displaying the prompt box, wherein the method for acquiring the style of the parent element in the step of calculating the actual width of the parent element specifically includes:
get the style of the parent element based on the windows.
The method for displaying the prompt box, wherein the method for creating the span tag in the step of calculating the width of the target title specifically comprises the following steps:
create span tags based on document.
The invention also provides a system for displaying the prompt box, which comprises the following components:
the parent element acquiring unit is used for acquiring a parent element of a target title and the frame width of the parent element when detecting that a mouse pointer slides through the target title in a webpage;
a parent element actual width calculation unit, configured to obtain, based on a style of the parent element, a first distance between the target title and a frame of the parent element and a second distance between the target title and the frame of the parent element, and calculate an actual width of the parent element according to the frame width, the first distance, and the second distance;
the target title width calculation unit is used for filling the target title into the span label based on the created span label and displaying the filled span label in the webpage so as to obtain the width of the target title;
and the prompt box display unit is used for comparing the actual width of the parent element with the width of the target title and displaying the target title based on the prompt box according to a comparison result.
The above prompt box display system further includes:
and the prompt box creating unit is used for setting a tooltip component according to a preset style, creating the prompt box through the tooltip component, and displaying the target title based on the prompt box.
The invention also provides a computer device, which comprises a memory, a processor and a computer program stored on the memory and capable of running on the processor, and is characterized in that the processor implements the method for displaying the prompt box when executing the computer program.
The present invention also provides a computer-readable storage medium, on which a computer program is stored, which, when being executed by a processor, implements the method for prompt box presentation as described above.
The invention has the technical effects or advantages that:
the method for displaying the prompt box comprises the steps of obtaining a parent element of a target title and the width of a frame of the parent element when a mouse pointer is detected to cross the target title in a webpage, obtaining a first distance between the target title and the frame of the parent element and a second distance between the target title and the frame of the parent element in the parent element based on the style of the parent element, calculating the actual width of the parent element according to the width of the frame, the first distance and the second distance, filling the target title into a span tag based on a created span tag, displaying the filled span tag in the webpage to obtain the width of the target title, comparing the actual width of the parent element with the width of the target title, and displaying the target title based on the prompt box according to a comparison result. By the aid of the method, the prompt box is automatically not displayed when the complete content is displayed, and the prompt box can be automatically displayed when the complete content is not displayed, so that reasonable display of the prompt box is achieved, and display redundancy of the prompt box is reduced.
Drawings
FIG. 1 is a flowchart of a method for displaying a prompt dialog box according to an embodiment of the present invention;
FIG. 2 is a diagram illustrating a process of displaying a prompt box according to an embodiment of the present invention;
FIG. 3 is a diagram illustrating a further example of a prompt box display process according to an embodiment of the present invention;
fig. 4 is a schematic structural diagram of a display system of a prompt box according to an embodiment of the present invention;
FIG. 5 is a block diagram of an electronic device according to an embodiment of the present invention;
in the above figures:
1. a parent element acquisition unit; 2. a parent element actual width calculation unit; 3. a target title width calculation unit; 4. a prompt box display unit; 5. a prompt box creating unit;
10. a bus; 11. a processor; 12. a memory; 13. a communication interface;
20. a web page; 21. a parent element; 22. a target title; 23. the width of the frame; 24. a first pitch; 25. a second pitch.
Detailed Description
In order to make the objects, technical solutions and advantages of the embodiments of the present invention clearer, the technical solutions in the embodiments of the present invention will be clearly and completely described below with reference to the drawings in the embodiments of the present invention, and it is obvious that the described embodiments are some embodiments of the present invention, but not all embodiments. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present invention.
It is obvious that the drawings in the following description are only examples or embodiments of the present application, and that it is also possible for a person skilled in the art to apply the present application to other similar contexts on the basis of these drawings without inventive effort. Moreover, it should be appreciated that in the development of any such actual implementation, as in any engineering or design project, numerous implementation-specific decisions must be made to achieve the developers' specific goals, such as compliance with system-related and business-related constraints, which may vary from one implementation to another. Reference in the specification to "an embodiment" means that a particular feature, structure, or characteristic described in connection with the embodiment can be included in at least one embodiment of the specification. The appearances of the phrase in various places in the specification are not necessarily all referring to the same embodiment, nor are separate or alternative embodiments mutually exclusive of other embodiments. Those of ordinary skill in the art will explicitly and implicitly appreciate that the embodiments described herein may be combined with other embodiments without conflict. Unless defined otherwise, technical or scientific terms referred to herein shall have the ordinary meaning as understood by those of ordinary skill in the art to which this application belongs. Reference to "a," "an," "the," and similar words throughout this application are not to be construed as limiting in number, and may refer to the singular or the plural. The present application is directed to the use of the terms "including," "comprising," "having," and any variations thereof, which are intended to cover non-exclusive inclusions; for example, a process, method, system, article, or apparatus that comprises a list of steps or modules (elements) is not limited to the listed steps or elements, but may include other steps or elements not expressly listed or inherent to such process, method, article, or apparatus. Reference to "connected," "coupled," and the like in this application is not intended to be limited to physical or mechanical connections, but may include electrical connections, whether direct or indirect.
The term "plurality" as referred to herein means two or more. "and/or" describes an association relationship of associated objects, meaning that three relationships may exist, for example, "A and/or B" may mean: a exists alone, A and B exist simultaneously, and B exists alone. The character "/" generally indicates that the former and latter associated objects are in an "or" relationship. Reference herein to the terms "first," "second," "third," and the like, are merely to distinguish similar objects and do not denote a particular ordering for the objects.
In order to solve the technical problems of high display redundancy degree and low rationality of the prompt box in the prior art, the invention provides a prompt box display method, which can automatically display the prompt box when complete content is displayed, and automatically display the prompt box when the complete content is not displayed, thereby realizing reasonable display of the prompt box and reducing the display redundancy degree of the prompt box.
The technical solution of the present invention will be described in detail below with reference to the specific embodiments and the accompanying drawings.
The embodiment provides a method for displaying a prompt box, which comprises the following steps:
a parent element obtaining step, wherein when a mouse pointer is detected to slide through a target title in a webpage, a parent element of the target title and the width of a frame of the parent element are obtained;
a parent element actual width calculation step, namely acquiring a first distance between the target title in the parent element and a frame of the parent element and a second distance between the target title in the parent element and the frame of the parent element based on the style of the parent element, and calculating to obtain the actual width of the parent element according to the frame width, the first distance and the second distance;
a target title width calculation step, wherein the target title is filled into the span label based on the created span label, and the filled span label is displayed in the webpage, so that the width of the target title is obtained;
and a prompt box display step, namely comparing the actual width of the parent element with the width of the target title, and displaying the target title based on the prompt box according to the comparison result.
According to the prompt box display method provided by the embodiment, the prompt box is not automatically displayed when the complete content is displayed, and the prompt box can be automatically displayed when the complete content is not displayed, so that reasonable display of the prompt box is realized, and the display redundancy of the prompt box is reduced.
Specifically, referring to fig. 1, fig. 1 is a flowchart of a method for displaying a prompt box according to an embodiment of the present invention. The invention provides a prompt box display method, which comprises the following steps:
a parent element obtaining step S1, when it is detected that the mouse pointer slides over the target title in the web page, obtaining a parent element of the target title and a border width of the parent element.
In a specific application, the parent element is a frame containing target subject content, and the frame width of the parent element is the frame width in the horizontal direction; when the mouse pointer is detected to slide over the target title in the webpage, the parent element of the target title and the offset width of the parent element can be obtained, and the width of the whole frame of the parent element can be obtained according to the offset width.
More specifically, referring to FIG. 2, the parent element has a width of 23 across the entire bounding box.
A parent element actual width calculating step S2, based on the style of the parent element, obtaining a first distance between the target title in the parent element and a border of the parent element and a second distance between the target title in the parent element and the border of the parent element, and calculating the actual width of the parent element according to the border width, the first distance and the second distance. Specifically, the first pitch and the second pitch are both in the horizontal direction.
In this embodiment, the method for calculating the actual width of the parent element in the parent element actual width calculating step S2 specifically includes:
calculating a sum of the first pitch and the second pitch;
and subtracting the sum value from the width of the frame, and calculating to obtain the actual width of the parent element.
In this embodiment, the method for acquiring the style of the parent element in the parent element actual width calculation step S2 specifically includes:
get the style of the parent element based on the windows.
In a particular application, and referring to fig. 2, a first distance 24 of target subject 22 within parent element 21 from the border of parent element 21, i.e., a first distance 24 of a first word in target subject 22 from the border of parent element 21, and a second distance 25 of the target subject within parent element 21 from the border of parent element 21, i.e., a second distance 25 of a last word displayed in target subject 22 from the border of parent element 21. When calculating the actual width of the parent element, the sum of the first distance 24 and the second distance 25 is calculated, and the sum is subtracted from the frame width 23 to obtain the actual width of the parent element.
And a target title width calculating step S3, based on the created span label, filling the target title into the span label, and displaying the filled span label in a webpage, thereby obtaining the width of the target title.
In this embodiment, the method for creating a span tag in the target title width calculating step S3 specifically includes:
create span tags based on document.
And a prompt box display step S4, comparing the actual width of the parent element with the width of the target title, and displaying the target title based on the prompt box according to the comparison result.
In this embodiment, the prompt box displaying step S4 specifically includes:
when the width of the target title is larger than the actual width of the parent element, displaying the target title based on the prompt box;
when the width of the target title is smaller than or equal to the actual width of the parent element, the target title does not need to be displayed based on the prompt box.
And a prompt box creating step S5, setting a tooltip component according to a preset style, creating the prompt box through the tooltip component, and displaying the target title based on the prompt box.
In a specific application, the tooltip component of the preset style includes three attributes, specifically including a place attribute, a content attribute, and an always attribute, wherein,
the place attribute is used for setting the display position of the prompt box when the mouse pointer slides over the target theme, can be set to be above, below, on the left side or on the right side of the target theme and the like, and can be represented by top, bottom, left, right and the like;
the content attribute is used for setting the content displayed by the prompt box when the mouse pointer slides over the target theme, and can be some prompting character or the content which is not completely displayed by the current target theme;
the always attribute and the bootean type are used for setting whether the prompt box is always displayed when the mouse pointer slides over the target theme, true is always displayed, and false is whether to display the prompt box according to the actual width of the parent element and the width of the target theme.
More specifically, in the present embodiment, the always attribute is set to false, and when the mouse pointer slides over the target subject, the cue box display is performed in accordance with the parent element obtaining step S1, the parent element actual width calculating step S2, the target title width calculating step S3, and the cue box displaying step S4.
According to the prompt box display method provided by the embodiment, the prompt box is not automatically displayed when the complete content is displayed, and the prompt box can be automatically displayed when the complete content is not displayed, so that reasonable display of the prompt box is realized, and the display redundancy of the prompt box is reduced.
Referring to fig. 3, as an example, the following describes a prompt box display process specifically as follows:
setting a tooltip component according to a preset style, creating the prompt box through the tooltip component, when detecting that a mouse pointer slides over a target title 22 in a webpage 20, obtaining a frame width 23 of a parent element 21 and a parent element 21 of the target title 22, obtaining a style of the parent element 21 based on window. getcomputedstyle (ref), thereby obtaining a first distance 24 from the frame of the target title 22 to the parent element 21 and a second distance 25 from the frame of the target title 22 to the frame of the parent element 21, calculating the first distance 24 and the second distance 25, subtracting the sum value from the frame width 23, thereby obtaining an actual width of the parent element 21, creating a span tag based on document. createelement (span), filling the target title 22 into the span tag according to the created span tag, displaying the filled span tag in the webpage 20, thereby obtaining the width of the target title 22, wherein the actual width of the target title 22 is greater than the actual width of the parent element 21, the contents of the target title 22 are presented based on the prompt box.
An embodiment of the present invention further provides a system for displaying a prompt dialog box, which, with reference to fig. 4, includes: the device comprises a parent element obtaining unit 1, a parent element actual width calculating unit 2, a target title width calculating unit 3, a prompt box display unit 4 and a prompt box creating unit 5, wherein the parent element obtaining unit 1 is connected with the parent element actual width calculating unit 2 and the prompt box creating unit 5, the parent element actual width calculating unit 2 is connected with the prompt box display unit 4, the target title width calculating unit 3 is connected with the prompt box display unit 4, and the prompt box display unit 4 is connected with the prompt box creating unit 5. In the present embodiment, among others,
the parent element acquiring unit 1 is used for acquiring a parent element of a target title and a frame width of the parent element when detecting that a mouse pointer slides through the target title in a webpage; the parent element obtaining unit 1 obtains the parent element of the target title according to the prompt box created by the prompt box creating unit 5, and the parent element obtaining unit 1 sends the parent element of the target theme and the frame width of the parent element to the parent element actual calculating unit 2.
A parent element actual width calculation unit 2, configured to obtain, based on a style of the parent element, a first distance between the target title and a frame of the parent element and a second distance between the target title and the frame of the parent element, and calculate an actual width of the parent element according to the frame width, the first distance, and the second distance; the parent-element actual width calculation unit 2 sends the actual width of the parent element to the prompt box presentation unit 4.
A target title width calculation unit 3, configured to fill the target title into the span tag based on the created span tag, and display the filled span tag in a web page, so as to obtain the width of the target title; the target title width calculation unit 3 sends the width of the target title to the prompt box presentation unit 4.
The prompt box display unit 4 is used for comparing the actual width of the parent element with the width of the target title, and displaying the target title based on the prompt box according to the comparison result; the prompt box display unit 4 determines whether to display the prompt box according to the prompt box created by the prompt box creation unit 5, the actual width of the parent element, and the width of the target title.
A prompt box creating unit 5, configured to set a tooltip component according to a preset style, create the prompt box through the tooltip component, and display the target title based on the prompt box; the prompt box creating unit 5 sends the created prompt box to the parent element acquiring unit 1 and the prompt box presenting unit 4.
The prompt box display system provided by the embodiment automatically does not display the prompt box any more when the complete content is displayed, and can automatically display the prompt box when the complete content is not displayed, so that reasonable display of the prompt box is realized, and the display redundancy degree of the prompt box is reduced.
Referring to fig. 5, the present embodiment further provides a computer device, which includes a memory 12, a processor 11, and a computer program stored on the memory 12 and executable on the processor 11, where the processor 11 implements the method for presenting the prompt dialog box as described above when executing the computer program.
The apparatus may comprise a processor 11 and a memory 12 in which computer program instructions are stored. Specifically, the processor 11 may include a Central Processing Unit (CPU), or A Specific Integrated Circuit (ASIC), or may be configured to implement one or more Integrated circuits of the embodiments of the present Application.
Memory 12 may include, among other things, mass storage for data or instructions. By way of example, and not limitation, memory 12 may include a Hard Disk Drive (Hard Disk Drive, abbreviated to HDD), a floppy Disk Drive, a Solid State Drive (SSD), flash memory, an optical Disk, a magneto-optical Disk, tape, or a Universal Serial Bus (USB) Drive or a combination of two or more of these. Memory 12 may include removable or non-removable (or fixed) media, where appropriate. The memory 12 may be internal or external to the data processing apparatus, where appropriate. In a particular embodiment, the memory 12 is a Non-Volatile (Non-Volatile) memory. In particular embodiments, Memory 12 includes Read-Only Memory (ROM) and Random Access Memory (RAM). The ROM may be mask-programmed ROM, Programmable ROM (PROM), Erasable PROM (EPROM), Electrically Erasable PROM (EEPROM), Electrically rewritable ROM (EAROM), or FLASH Memory (FLASH), or a combination of two or more of these, where appropriate. The RAM may be a Static Random-Access Memory (SRAM) or a Dynamic Random-Access Memory (DRAM), where the DRAM may be a Fast Page Mode Dynamic Random-Access Memory (FPMDRAM), an Extended data output Dynamic Random-Access Memory (EDODRAM), a Synchronous Dynamic Random-Access Memory (SDRAM), and the like.
The memory 12 may be used to store or cache various data files that need to be processed and/or used for communication, as well as possible computer program instructions executed by the processor 11.
The processor 11 reads and executes the computer program instructions stored in the memory 12 to implement the method for displaying the prompt dialog box in any of the above embodiments.
In some of these embodiments, the computer device may also include a communication interface 13 and a bus 10. Referring to fig. 5, the processor 11, the memory 12, and the communication interface 13 are connected via the bus 10 to complete communication therebetween. The communication interface 13 is used for implementing communication between modules, devices, units and/or equipment in the embodiment of the present application. The communication port 13 may also be implemented with other components such as: the data communication is carried out among external equipment, image/data acquisition equipment, a database, external storage, an image/data processing workstation and the like.
The bus 10 includes hardware, software, or both to couple the components of the electronic device to one another. Bus 10 includes, but is not limited to, at least one of the following: data Bus (Data Bus), Address Bus (Address Bus), Control Bus (Control Bus), Expansion Bus (Expansion Bus), and Local Bus (Local Bus). By way of example, and not limitation, Bus 10 may include an Accelerated Graphics Port (AGP) or other Graphics Bus, an Enhanced Industry Standard Architecture (EISA) Bus, a Front-Side Bus (FSB), a HyperTransport (HT) Interconnect, an ISA (ISA) Bus, an InfiniBand (InfiniBand) Interconnect, a Low Pin Count (LPC) Bus, a memory Bus, a Microchannel Architecture (MCA) Bus, a PCI (Peripheral Component Interconnect) Bus, a PCI-Express (PCI-X) Bus, a Serial Advanced Technology Attachment (AGP) Bus, a Local Video Association (Video Electronics Bus), abbreviated VLB) bus or other suitable bus or a combination of two or more of these. Bus 10 may include one or more buses, where appropriate. Although specific buses are described and shown in the embodiments of the application, any suitable buses or interconnects are contemplated by the application.
In addition, in combination with the method for displaying the prompt dialog in the above embodiment, the embodiment of the present application may provide a computer-readable storage medium to implement. The computer readable storage medium having stored thereon computer program instructions; the computer program instructions, when executed by a processor, implement the method of any of the above embodiments.
The above description is only a preferred embodiment of the present application and is not intended to limit the present application, and various modifications and changes may be made by those skilled in the art. Any modification, equivalent replacement, improvement and the like made within the spirit and principle of the present application shall be included in the protection scope of the present application.

Claims (10)

1. A method for displaying a prompt box is characterized by comprising the following steps:
a parent element obtaining step, wherein when a mouse pointer is detected to slide through a target title in a webpage, a parent element of the target title and the width of a frame of the parent element are obtained;
a parent element actual width calculation step, namely acquiring a first distance between the target title in the parent element and a frame of the parent element and a second distance between the target title in the parent element and the frame of the parent element based on the style of the parent element, and calculating to obtain the actual width of the parent element according to the frame width, the first distance and the second distance;
a target title width calculation step, wherein the target title is filled into the span label based on the created span label, and the filled span label is displayed in the webpage, so that the width of the target title is obtained;
and a prompt box display step, namely comparing the actual width of the parent element with the width of the target title, and displaying the target title based on the prompt box according to the comparison result.
2. The method for displaying a prompt box according to claim 1, wherein the method for calculating the actual width of the parent element in the parent element actual width calculating step specifically comprises:
calculating a sum of the first pitch and the second pitch;
and subtracting the sum value from the width of the frame to calculate the actual width of the parent element.
3. The method for displaying a prompt box according to claim 1, wherein the prompt box displaying step specifically comprises:
when the width of the target title is larger than the actual width of the parent element, displaying the target title based on the prompt box;
when the width of the target title is smaller than or equal to the actual width of the parent element, the target title does not need to be displayed based on the prompt box.
4. The method for displaying the prompt box according to any one of claims 1 to 3, further comprising:
and a prompt box creating step, wherein a tooltip component is set according to a preset style, the prompt box is created through the tooltip component, and the target title is displayed based on the prompt box.
5. The method for displaying a prompt box according to claim 1, wherein the method for obtaining the style of the parent element in the step of calculating the actual width of the parent element specifically comprises:
get the style of the parent element based on the windows.
6. The method for displaying the prompt dialog box according to claim 1, wherein the method for creating the span tag in the step of calculating the width of the target title specifically comprises:
create span tags based on document.
7. A system for prompt box display, comprising:
the parent element acquiring unit is used for acquiring a parent element of a target title and the frame width of the parent element when detecting that a mouse pointer slides through the target title in a webpage;
a parent element actual width calculation unit, configured to obtain, based on a style of the parent element, a first distance between the target title and a frame of the parent element and a second distance between the target title and the frame of the parent element, and calculate an actual width of the parent element according to the frame width, the first distance, and the second distance;
the target title width calculation unit is used for filling the target title into the span label based on the created span label and displaying the filled span label in the webpage so as to obtain the width of the target title;
and the prompt box display unit is used for comparing the actual width of the parent element with the width of the target title and displaying the target title based on the prompt box according to a comparison result.
8. The system for prompt box presentation according to claim 7, further comprising:
and the prompt box creating unit is used for setting a tooltip component according to a preset style, creating the prompt box through the tooltip component, and displaying the target title based on the prompt box.
9. A computer device comprising a memory, a processor, and a computer program stored on the memory and executable on the processor, wherein the processor implements a method of prompt box presentation as claimed in any one of claims 1 to 6 when executing the computer program.
10. A computer-readable storage medium, on which a computer program is stored, which, when being executed by a processor, carries out a method of prompt box presentation according to any one of claims 1 to 6.
CN202110171045.5A 2021-02-08 2021-02-08 Prompt box display method, system, equipment and storage medium Active CN112905925B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202110171045.5A CN112905925B (en) 2021-02-08 2021-02-08 Prompt box display method, system, equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202110171045.5A CN112905925B (en) 2021-02-08 2021-02-08 Prompt box display method, system, equipment and storage medium

Publications (2)

Publication Number Publication Date
CN112905925A true CN112905925A (en) 2021-06-04
CN112905925B CN112905925B (en) 2024-07-05

Family

ID=76123959

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202110171045.5A Active CN112905925B (en) 2021-02-08 2021-02-08 Prompt box display method, system, equipment and storage medium

Country Status (1)

Country Link
CN (1) CN112905925B (en)

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103399903A (en) * 2013-07-26 2013-11-20 贝壳网际(北京)安全技术有限公司 Prompting method and device for prompting information in browser and client
CN103793389A (en) * 2012-10-29 2014-05-14 金蝶软件(中国)有限公司 Method and device for processing query data
CN104252476A (en) * 2013-06-27 2014-12-31 重庆新媒农信科技有限公司 Display method and system for lowering valid page covering rate
CN105892836A (en) * 2016-03-31 2016-08-24 北京奇虎科技有限公司 Encyclopedic entry-based activated state barrage display method and device
JP2017080414A (en) * 2015-10-29 2017-05-18 キヤノンマーケティングジャパン株式会社 Information processing device, information processing method, and program
CN111124210A (en) * 2019-03-19 2020-05-08 张斌 List management method and electronic equipment

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103793389A (en) * 2012-10-29 2014-05-14 金蝶软件(中国)有限公司 Method and device for processing query data
CN104252476A (en) * 2013-06-27 2014-12-31 重庆新媒农信科技有限公司 Display method and system for lowering valid page covering rate
CN103399903A (en) * 2013-07-26 2013-11-20 贝壳网际(北京)安全技术有限公司 Prompting method and device for prompting information in browser and client
JP2017080414A (en) * 2015-10-29 2017-05-18 キヤノンマーケティングジャパン株式会社 Information processing device, information processing method, and program
CN105892836A (en) * 2016-03-31 2016-08-24 北京奇虎科技有限公司 Encyclopedic entry-based activated state barrage display method and device
CN111124210A (en) * 2019-03-19 2020-05-08 张斌 List management method and electronic equipment

Also Published As

Publication number Publication date
CN112905925B (en) 2024-07-05

Similar Documents

Publication Publication Date Title
CN109783181B (en) Screen adaptive display method, electronic device and computer storage medium
WO2018161709A1 (en) Method and device for rendering overlay comment
US11455460B2 (en) Method for displaying handwritten note in electronic book, electronic device and computer storage medium
US20130024757A1 (en) Template-Based Page Layout for Hosted Social Magazines
CN110187816B (en) Automatic page turning method for cartoon type electronic book, computing device and storage medium
CN112835499B (en) Carousel graph display method, device, equipment and medium
CN111651700B (en) Message display method and device, electronic equipment and storage medium
CN111859865A (en) Method, device, terminal and medium for converting PDF document
US9535880B2 (en) Method and apparatus for preserving fidelity of bounded rich text appearance by maintaining reflow when converting between interactive and flat documents across different environments
CN115237522A (en) Page self-adaptive display method and device
KR101429466B1 (en) Method and system for providing page using dynamic page division
CN111460342B (en) Page rendering display method and device, electronic equipment and computer storage medium
CN113378511B (en) Page display method and device, electronic equipment and storage medium
CN113504964B (en) Page component height determination method, page component height determination device, computer equipment and storage medium
CN111274509A (en) Object list page display method and device
JP2016095501A (en) Document layout for electronic display
CN109960561B (en) Page element display method and device and electronic equipment
CN112905925A (en) Method, system, equipment and storage medium for displaying prompt box
CN114661370B (en) Resource loading method and device, electronic equipment and computer storage medium
KR102087274B1 (en) Web electric document editing apparatus for rendering object and operating method thereof
US10740539B2 (en) Page structure adjustments
US11330338B2 (en) Method and system of displaying video comments, computing device, and readable storage medium
CN115390976A (en) Layout method of interface design, display method of interface and related equipment
CN113010824A (en) Method and system for realizing unlimited scrolling of long list of web pages
US20180189251A1 (en) Automatic multi-lingual editing method for cartoon content

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant