CN104268250A

CN104268250A - Playing method and device of video elements in web page

Info

Publication number: CN104268250A
Application number: CN201410523180.1A
Authority: CN
Inventors: 高庆光
Original assignee: Beijing Qihoo Technology Co Ltd; Qizhi Software Beijing Co Ltd
Current assignee: Beijing Qihoo Technology Co Ltd; Qizhi Software Beijing Co Ltd
Priority date: 2014-09-30
Filing date: 2014-09-30
Publication date: 2015-01-07

Abstract

The invention discloses a playing method and device of video elements in a web page and relates to the technical field of browsers. The playing method comprises obtaining a web page document with the video elements from the web page server side and loading and displaying the web page document with a display control script for the video elements into the current web page; determining that the video elements are partially displayed and or are not displayed in the current browser display window through the display control script; performing independent display on the video elements in the current web page in the current browser display window through the display control script. According to the playing method and device of the video elements in the web page, the video elements can be displayed in the display window after the initial position of the video elements in the web page document moves out of the display window and accordingly a user can watch the playing content in the video elements when browsing other information in the web page.

Description

A kind of playing method and device of video elements in webpage

Technical field

The present invention relates to browser technology field, be specifically related to a kind of playing method and device of video elements in webpage.

Background technology

Browser refers to can the HTML (HTML (Hypertext Markup Language), HyperText Mark-up Language) of display web page server or file system) file content, and allow a kind of software of user and these file interactions.Web browser mainly through http protocol and web page server alternately and obtain webpage, specified by URL (URL(uniform resource locator), Uniform Resource Locator), and file layout is generally HTML by these webpages.Can comprise multiple document in a webpage, each document obtains from server respectively.HTTP content type and URL protocol specification allow Web page maker embedded images, video etc. in webpage.

And in current web page server, there is a kind of webpage with video content, its video content is generally play in certain position of the page, then very long below a video part is other guide, such as relevant advertisements picture, the link of associated recommendation video, the contents such as current video comment, its page whole height is far longer than the height of browser display form.So, when user removes information (such as the video comments) browsing other positions by mouse roller or the scroll bar slip page, the video play in the page may shift out display window, so that user then cannot watch video content.

Summary of the invention

In view of the above problems, the present invention is proposed to provide a kind of overcoming the problems referred to above or the playing device of video elements in webpage solved the problem at least in part and the player method of corresponding video elements in webpage.

According to one aspect of the present invention, provide the player method of video elements in webpage, comprising:

Get the web document with video elementary from web page server side, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

Described display and control script judges that described video elementary part in current browser display window shows and/or is not shown fully;

Independent display is carried out by the current web page of described video elementary in current browser display window by described display and control script.

According to another aspect of the present invention, also disclose a kind of playing device of video elements in webpage, comprising:

Script load-on module, be suitable for the web document got from web page server side with video elementary, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

Display position judge module, is suitable for described display and control script and judges that described video elementary part in current browser display window shows and/or is not shown fully;

Display position change module, is suitable for carrying out independent display by described display and control script by the current web page of described video elementary in current browser display window.

According to the playing method and device of a kind of video elements in webpage of the present invention, the web document that can provide web page server side adds display and control script, this display and control script judge described video elementary in current browser display window part display and/or fully be not shown after, independent display is carried out by the current web page of described video elementary in current browser display window by described display and control script, solve thus user slide the page time, after video elementary shifts out display window, user cannot watch the problem of the play content in video elementary simultaneously when browsing the information in webpage, time achieve can after in web document, the initial position of video elementary shifts out display window, video elementary is appeared in display window show, other information (such as video comments in user browser webpage, recommend video etc.) time can watch the beneficial effect of the play content in video elementary simultaneously.

Above-mentioned explanation is only the general introduction of technical solution of the present invention, in order to technological means of the present invention can be better understood, and can be implemented according to the content of instructions, and can become apparent, below especially exemplified by the specific embodiment of the present invention to allow above and other objects of the present invention, feature and advantage.

Accompanying drawing explanation

By reading hereafter detailed description of the preferred embodiment, various other advantage and benefit will become cheer and bright for those of ordinary skill in the art.Accompanying drawing only for illustrating the object of preferred implementation, and does not think limitation of the present invention.And in whole accompanying drawing, represent identical parts by identical reference symbol.In the accompanying drawings:

Fig. 1 shows a kind of according to an embodiment of the invention schematic flow sheet of player method of video elements in webpage;

Fig. 2 shows a kind of according to an embodiment of the invention schematic flow sheet of player method of video elements in webpage;

Fig. 3 shows a kind of according to an embodiment of the invention schematic flow sheet of player method of video elements in webpage;

Fig. 3 A shows the initial stress state schematic diagram of video elementary a kind of according to an embodiment of the invention;

Fig. 3 B shows when a kind of according to an embodiment of the invention video elementary part does not show and triggers the schematic diagram that wicket plays video elementary;

Fig. 4 shows the schematic flow sheet of the player method of a kind of video elements in webpage according to the preferred embodiment of the present invention;

The schematic diagram that wicket plays video elementary is triggered when Fig. 4 A a kind of video elementary top shown according to an embodiment of the invention on the basis of Fig. 3 A starts entering part display state;

Fig. 5 shows the schematic flow sheet of the player method of a kind of video elements in webpage according to the preferred embodiment of the present invention;

Fig. 5 A a kind of video elementary top shown according to an embodiment of the invention on the basis of Fig. 3 A starts to enter when all not showing state triggers the schematic diagram that wicket plays video elementary;

Fig. 6 shows a kind of according to an embodiment of the invention structural representation of playing device of video elements in webpage;

Fig. 7 shows a kind of according to an embodiment of the invention structural representation of playing device of video elements in webpage;

Fig. 8 shows a kind of according to an embodiment of the invention structural representation of playing device of video elements in webpage;

Fig. 9 shows the structural representation of the playing device of a kind of video elements in webpage according to the preferred embodiment of the present invention;

Figure 10 shows the structural representation of the playing device of a kind of video elements in webpage according to the preferred embodiment of the present invention; And

Figure 11 shows the structural representation of the Play System of a kind of video elements in webpage according to the preferred embodiment of the present invention.

Embodiment

Below with reference to accompanying drawings exemplary embodiment of the present disclosure is described in more detail.Although show exemplary embodiment of the present disclosure in accompanying drawing, however should be appreciated that can realize the disclosure in a variety of manners and not should limit by the embodiment set forth here.On the contrary, provide these embodiments to be in order to more thoroughly the disclosure can be understood, and complete for the scope of the present disclosure can be conveyed to those skilled in the art.

One of core concept of the present invention is: for web page server provide with in the web document of video elementary, add display and control script; So load described display and control when browser loads above-mentioned web document, this display and control script judges whether the video elementary in webpage partly shows and/or be not shown fully in current browser display window, if part display and/or be not shown fully in current browser display window, carry out independent display by described display and control script by the current web page of described video elementary in current browser display window.To make the video elementary in webpage can play in display window with the identity of the video elementary of webpage always, make user when rolling webpage is to browse the information of non-video element, also can see the play content of video elementary easily.

Embodiment one

With reference to Fig. 1, it illustrates the player method of a kind of video elements in webpage of the present invention, specifically can comprise:

Step 110, gets the web document with video elementary from web page server side, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

In embodiments of the present invention, there is provided in the webpage of video elementary (such as playing the video elementary of the content such as TV play, film) for server side, add the display and control script for described video elementary, this display and control script has the logic that control browser carries out follow-up implementation.

So, when browser gets the web document with video elementary from web page server, the display and control script for described video elementary in this web document, is just comprised.Browser resolves and the described web document of loading, then can load described display and control script, namely this display and control script enters operational process.

In actual applications, above-mentioned web document is HTML (Hyper Text Mark-up Language, HTML (Hypertext Markup Language)) document.

Step 120, described display and control script judges that described video elementary part in current browser display window shows and/or is not shown fully;

In actual applications, after described display and control script loads, can monitor the onsroll event (rolling event) on browser, this rolling event can be triggered by mouse roller, also can be triggered by the mode dragging scroll bar.The triggering of this rolling event, means that user moves up and down at dragging webpage.

When user drags webpage to move, the logic module loaded by display and control script, judges the video elementary of showing in the webpage whether display of part or whole not being shown in current browser display window.If judge that described video elementary part in current browser display window shows and/or is not shown fully, enter step 130.

Step 130, carries out independent display by described display and control script by the current web page of described video elementary in current browser display window.

In embodiments of the present invention, after webpage has been loaded, carry out the video elementary shown at webpage initial position, by the steering logic of described display and control script, can show independent in the webpage of current display window for the video elementary of this initial position.

Described independent display can be understood as, and is peeled off by the display position of video elementary, certain position in its webpage can shown in the display window of current browser is shown from initial position.Certainly, from overall aspect, can be understood as the video content of video elementary to be retained in browser display form always and play, need not hide the operation of webpage or show incomplete along with user.

In certain the present invention, described independent display, generally after the broadcast interface entirety of video elementary is reduced, show in current web page in browser display form, avoid the play area because video elementary is initial too large, when it carries out independently showing, cover user's browsing webpage other information (such as video comments).

Preferably, describedly to be comprised carrying out independence display in the current web page of described video elementary in current browser display window by described display and control script:

Sub-step 131, described display and control script revises display position and the display layer index of described video elementary, makes to be shown by top set in the current web page of described video elementary in current browser display window.

Judging that the video elementary in webpage is in part display in current browser display window and/or after not being shown fully, then can revise the position that described video elementary shows in webpage, and revise the display layer index (such as z-index attribute) of video elementary, play in the webpage that video elementary can be shown always in page form.

Preferably, by described display and control script by after carrying out independence display in the current web page of described video elementary in current browser display window, also comprise:

Sub-step 132, obtains the associated video information of the video play in current video element; When listening to mouse-over to described video elementary display position, supplying described associated video information in video elementary display and click interface is provided.

By the video information of current video elements correlation, such as build and click interface based on the network address of associated video, title and show user.

Sub-step 133, when listening to mouse-over to described video elementary display position, loading and showing the functional interface for current video content; Described functional interface comprises download interface and/or shares interface and/or collection interface and/or call third party's video jukebox software plays at least one in described video content interface.

The present invention can provide the function of multiple practicality, get through and (such as share interface with the interface of other software (such as call third party's video jukebox software and play described video content interface), assembly (such as download interface, collect interface), website, as being shared with Sina's microblogging), provide more enriching experiences to user.

Sub-step 134, when listening to the dimension modifying operation for video elementary display position, according to the display size in drag motions amendment video elementary CSS file.

The video elementary of independent display of the present invention can pull change display size according to user to the display box of video elementary.

Preferably, described display and control script judge described video elementary in current browser display window part display and/or fully be not shown before, also comprise:

Sub-step 135, judges whether there is multiple video elementary in current web page; If existed, then the video elementary pointing out user to select to carry out fenestella display also provides option interface; For the unselected video elementary of user, stop judging that described video elementary part in current browser display window shows and/or is not shown fully.

When there is multiple video in a webpage, the present invention can be supplied to user's options, and make it can select which video elementary to carry out independent play-out to, which is without independent play-out.

Sub-step 136, when listening to mouse-over to described video elementary display position, triggers the pausing operation to play content in described video elementary; After mouse shifts out described video elementary display position, then continue to play described video content.

Whether the embodiment of the present invention controls the broadcasting/time-out of video by the hovering of mouse, user-friendly.

Sub-step 137, after the display position in described video elementary listens to drag motions, by the position of the display position of described video elementary along with drag motions moves.

The video elementary that the embodiment of the present invention independently shows also can pull moving display area according to user, user-friendly.

Preferably, described by described display and control script by after carrying out independence display in the current web page of described video elementary in current browser display window, also comprise:

Sub-step 138, according to the scroll bar event that user triggers, judges the initial display position whether all showing described video elementary in described display window; Be suitable for if then the video elementary of current display position is reduced to initial display position.

In embodiments of the present invention, in order to improve Consumer's Experience, when user scrolls up webpage, if be rolled to the display position that video elementary initially occurs, the video elementary of so carrying out fenestella broadcasting then gets back to its initial display position, and its fenestella play mode is then cancelled.

Embodiment two

With reference to Fig. 2, it illustrates the player method of a kind of video elements in webpage of the present invention, specifically can comprise:

Step 210, gets the web document with video elementary from web page server side, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

Step 220, described display and control script judges that described video elementary part in current browser display window shows and/or is not shown fully;

When user drags webpage to move, the logic module loaded by display and control script, judges the video elementary of showing in the webpage whether display of part or whole not being shown in current browser display window.If judge that described video elementary part in current browser display window shows and/or is not shown fully, enter step 230.

Preferably, described display and control script judges that described video elementary part in current browser display window shows and/or is not shown fully, comprising:

Sub-step 222, according to display position, the display position of display window, the display position of scroll bar, the size attribute of page entirety of video elementary, judges that described video elementary part in current browser display window shows and/or is not shown fully.

In actual applications, 4 attributes are had at least to need to process when browser is shown the page: display location such as wide (width), high (height) of browser display form; The size attribute of web document wide (width), high (height) of its entirety when such as it is shown; The display location of each element in the page in document, such as have for video element: the distance (left) etc. on the left of the distance (top) of wide (width), high (height), distance page top, the distance page); The display location of scroll bar, the such as distance (top) at distance display window top, the distance (left) etc. on the left of distance display window.

Then, described video elementary part in current browser display window can be calculated according to above-mentioned position attribution in dragging process to show and/or be not shown fully.

Step 230, described display and control script revises display position and the display layer index of described video elementary, makes to be shown by top set in the current web page of described video elementary in current browser display window.

Preferably, described display and control script revises display position and the display layer index of described video elementary, makes to be shown by top set in the current web page of described video elementary in current browser display window, comprising:

Sub-step 232, carries out convergent-divergent by display size in the display position of described video elementary, is revised as by positional parameter in described display position in the current web page in current browser display window and shows.

For the web document after aforementioned loading, by the video elementary in initial web document, the initial display size of video elementary is carried out convergent-divergent, such as video elementary is initially wide is 600px (px, pixel), height is 400px, and so it widely can be scaled 150Px, height is scaled 100px.

Above-mentioned convergent-divergent can bi-directional scaling, is such as scaled 1/4 original size, and concrete scaling can show size according to actual pages and arrange, and the present invention is not limited it.

Simultaneously, for the position at video elementary initial place in webpage, its location parameter is modified, under such as initial situation, the distance at the distance webpage top of video elementary is 200px, distance on the left of distance webpage is 100px, and so this positional parameter can be revised as distance display window distance from bottom is 0, and on the right side of distance webpage, distance is 0.The amendment of concrete positional parameter can be selected according to actual conditions, as long as make video elementary can show in display window.

Certainly, also can revise the value of the current z-index of video elementary, make it be in the most top layer of the page, be unlikely to be blocked by other elements.In fact, the value of z-index is larger, represents its level higher, only needs the value ensureing z-index to be that in HTML, all elements relates in z-index value maximum in the present invention

Preferably, described display and control script revises display position and the display layer index of described video elementary, makes to be comprised by top set display in the current web page of described video elementary in current browser display window:

Sub-step 2321, in the CSS file of webpage HTML, being revised as by the display position of the CSS pattern of described video elementary in the current web page in current browser display window and showing, is the indexing parameter of top layer by the display layer index modification of described CSS pattern.

Browser is by resolving html document (HTML, HTML (Hypertext Markup Language), Hypertext Markup Language), and then carry out playing up, html document is generally several part:

One, comprises the content that can resolve to dom tree (DOM, document dbject model Document Object).

DOM is a kind of with platform with the irrelevant interface of language, and its allows the content of program and script dynamic access and amendment document, structure and type.It define a series of object and method carries out various random operation to the node of dom tree:

● Document object: as the most high node of tree, Document to as if entrance that whole document is operated.

● Element and Attr object: these node objects are all the mappings of a web document part, the deciding grade and level level of node reflects the structure of document just.

● Text object: as the child node of Element and Attr object, the Text object representation content of text of element or attribute.Text node no longer comprises any child node.

All nodes in dom tree are all inherited from node object, node object defines some the most basic attribute and methods, utilize these methods can realize traversal of tree, meanwhile, the title of node, value judge its type can also be learnt according to attribute.

Its two, for controlling the CSS pattern (CSS, Cascading Style Sheet, Cascading Style Sheet) of the presentation mode (such as position, size) of the node of each DOM.

In fact, the present invention does not carry out any change for dom tree itself, just the CSS pattern of video elementary is changed, be about to for the parameter in the CSS pattern of video elementary, such as the display level z-index of wide, high, positional parameter (as the distance of distance page top, apart from the distance on the left of the page), video elementary.

Preferably, the display position of the CSS pattern of described video elementary is revised as in the current web page in current browser display window to show and comprises:

Sub-step 234, for the CSS pattern of described video elementary, modifies the relative ticker position of positional parameter in the display position of described CSS pattern.

In actual applications, the CSS pattern positional parameter of aforementioned video element (as the distance of distance page top, apart from the distance on the left of the page) can be revised as distance scroll bar position distance to a declared goal, such as revising video elementary top apart from scroll bar distance from top is m; When distance value h bottom scroll bar top to rolling groove is less than m, during the height j of setting video element, m value is revised as h-j.Certainly, relative for described positional parameter scroll bar can also be carried out other and arrange, the present invention is not limited it.

Sub-step 236, for the CSS pattern of described video elementary, modifies relative for the positional parameter in the display position of described CSS pattern display window position.

In actual applications, the CSS pattern positional parameter of aforementioned video element (as the distance of distance page top, apart from the distance on the left of the page) can be modified display window position relatively.Such as video elementary is fixed on lower right corner display, the positional parameter namely revising CSS pattern on the right side of display window distance be 0, be 0 to distance from bottom; Or be fixed on lower left corner display etc.Certainly, concrete display position the present invention is not limited it.

In above-mentioned steps, video elementary just moves to another one position from the initial position of web document and shows, its DIV structure does not change, and changing except display size and display position parameter, display layer indexing parameter of its inside, other attributes and parameter can change.Namely be equivalent to the play area of initial position to move in display window show, the play area itself after mobile except size different from initial, other substantially.

Further, the present invention can change the play area of the video elementary after movement.Namely preferred, described display and control script revises display position and the display layer index of described video elementary, makes to be comprised by top set display in the current web page of described video elementary in current browser display window:

Sub-step 238, hides the control knob in described video elementary.

In actual applications, except interface except playing video content can show by the present invention, in video elementary, other interfaces all can hide, such as control knob is hidden, the border of play area hides, make user only with seeing the interface of playing video content not by the impact of other button interfaces of video elementary.Such as display or the visibilitys property value of control knob is revised as invisible.

After sub-step 238, also comprise:

Sub-step 2381, when listening to mouse-over to described video elementary display position, shows the control knob in described video elementary.

Namely in the CSS pattern of Play Control button, its attribute whether shown is revised as display from hiding.Such as display or the visibilitys property value of control knob is revised as visible.

Preferably, revise display position and the display layer index of described video elementary at described display and control script, after making to be shown by top set in the current web page of described video elementary in current browser display window, also comprise:

Sub-step 240, obtains the associated video information of the video play in current video element; When listening to mouse-over to described video elementary display position, supplying described associated video information in video elementary display and click interface is provided.

In actual applications, possibility one is with in the webpage of video elementary, and there is the video information be associated with video in a large number, the present invention can add the logic of sub-step 240 in display script, obtains the associated video information of the video play in current video element; When listening to mouse-over to described video elementary display position, supplying described associated video information in video elementary display and click interface is provided.

When at video elementary display position, when monitoring mouse suspension event (onmouseover event), in video elementary, show described associated video information and click interface is provided.When showing associated video information, can other position display outside the play area of the broadcasting video content of video elementary.Certainly, also new displaying interface can be added in video elementary, in order to show associated video information and to provide click interface for each video information.

When user clicks the click interface for certain video Q, then in the play area of video elementary, play this video Q.

There is no click action when detecting user, after mouse removes video elementary display position, after namely detecting the onmouseout event shifting out video elementary display position, then hiding described associated video information and clicking interface.

Sub-step 242, when listening to mouse-over to described video elementary display position, loading and showing the functional interface for current video content; Described functional interface comprises download interface and/or shares interface and/or collection interface and/or call third party's video jukebox software plays at least one in described video content interface.

In display and control script, the logic of sub-step 242 can also be added, in a browser the module of the above-mentioned logic of load and execution.Namely after the display position in video elementary listens to mouse hover event, in video elementary, add the functional interface for current video content, described functional interface comprises download interface and/or shares interface and/or collection interface and/or call third party's video jukebox software plays at least one in described video content interface.Described download interface downloads the video of current broadcasting for the download component calling browser.Described share interface for by current video sharing to the website of specifying, such as Renren Network, the websites such as Sina's microblogging.The described third party's of calling video jukebox software is play described video content interface and is comprised playout softwares such as calling PPS player, in this playout software, play video.

Sub-step 244, when listening to the dimension modifying operation for video elementary display position, according to the display size in drag motions amendment video elementary CSS file.

In embodiments of the present invention, the function of modifiable video elementary size is provided at the frame place of video elementary display position.When the frame place in video elementary listens to mouse focus, then trigger frame and pull arrow, when the drag motions listening to mouse again and press+drag, when namely listening to onmousedown+onmousemove event again, then the size of video elementary become large along with drag motions or diminish.When changing video elementary size, according to the drag coordinates of mouse, the display size in amendment video elementary CSS file, such as by the wide height of video elementary along with pulling of mouse is changed.When listening to mouse and decontroling event (onmouseup event), then fix the display size of current video element.

Sub-step 246, when listening to mouse-over to described video elementary display position, triggers the pausing operation to play content in described video elementary; After mouse shifts out described video elementary display position, then continue to play described video content.

In embodiments of the present invention, also can provide and suspend easily and playing function, namely after the display position in video elementary listens to mouse hover event, trigger the pausing operation to play content in described video elementary; After mouse shifts out described video elementary display position, then continue to play described video content.

In practice, in initial video element when the page has just loaded, there is broadcasting/pause button, the present invention then will need the situation clicking broadcasting/pause button, be revised as the display position that user's mouse slides into video elementary and can suspend video, skid off described display position, video continues to play.

In addition, when there is sub-step 2381, sub-step 240, sub-step 242, in sub-step 246 during multiple function, then the number of the viewing area of video elementary according to above-mentioned functions can be divided, each areas accept to mouse hover event be responsible for triggering function.

Sub-step 248, after the display position in described video elementary listens to drag motions, by the position of the display position of described video elementary along with drag motions moves.

When listening to onmousedown+onmousemove event at the display position of described video elementary, dragging the overall display position of video elementary, not changing the display size of video elementary.In embodiments of the present invention, be generally when the video playback area of video elementary listens to onmousedown+onmousemove event, the overall display position of video changes along with pulling change.

Preferably, the position of the display position of described video elementary is comprised along with drag motions moves:

Sub-step 2481, in the CSS pattern of the described video elementary of correspondence, changes the positional parameter of video elementary along with the location parameter pulled in webpage window area.

Namely in actual applications, can according to the positional parameter in the CSS pattern of the coordinate amendment video elementary of mouse, video elementary, apart from the distance on the left of display window, so can be changed the position of display by the Distance geometry such as revising video elementary distance display window top along with the dragging of mouse.

Sub-step 250, judges whether there is multiple video elementary in current web page; If existed, then the video elementary pointing out user to select to carry out fenestella display also provides option interface; For the unselected video elementary of user, stop judging that described video elementary part in current browser display window shows and/or is not shown fully.

Can by each video elementary in the video tab identification page at display script of the present invention; Described video tab is <video> label such as, type type in such as <embed> label, if it is video type namely show that corresponding element is video elementary, or judge the id=" flash " in this label, " media " equivalence, also can judge that element is video elementary; Type type in such as <object>, if it is video type namely show that corresponding element is video elementary, or judge the id in this label, id=" flash ", " media " equivalence, also can judge that element is video elementary.

So when there is multiple video elementary, extract the subject name of video elementary, then pop-up box is generated, in pop-up box, generate options with described subject name choose for user, point out user whether to select some video elementary to be carried out fenestella broadcasting (can be understood as the independent Presentation Function in the embodiment of the present invention) function simultaneously.When user chooses one or more option and after determining, display and control script for unselected video elementary, then stops performing subsequent logic to it, to the video elementary that user chooses, then performs subsequent logic.

Further, described display and control script revises display position and the display layer index of described video elementary, after making to be shown by top set in the current web page of described video elementary in current browser display window, also comprises:

Step 260, according to the scroll bar event that user triggers, judges the initial display position whether all showing described video elementary in described display window; If so, then the video elementary of current display position is reduced to initial display position.

Preferably, described video elementary is reduced to initial display position to comprise:

Sub-step 2601, in the CSS file of webpage HTML, being revised as at initial display position by the display position of the CSS pattern of described video elementary, is initial indexing parameter by the display layer index modification of described CSS pattern.

This step is the step contrary with sub-step 2321, and the display position by the SS pattern of the video elementary of fenestella broadcasting is reduced to its initial display position, is namely reduced to the display position that webpage has just loaded rear video element; Be initial indexing parameter by the display layer index modification of described CSS pattern, be namely reduced to the display layer index that webpage has just loaded rear video element.

The present invention and the similar step principle of embodiment one similar, be not described in detail in this.

The web document that the player method of a kind of video elements in webpage of the present invention can provide web page server side adds display and control script, this display and control script judge described video elementary in current browser display window part display and/or fully be not shown after, revise display position and the display layer index of described video elementary, make to be shown by top set in the current web page of described video elementary in current browser display window, solve thus user slide the page time, after video elementary shifts out display window, user cannot watch the problem of the play content in video elementary simultaneously when browsing the information in webpage, time achieve can after in web document, the initial position of video elementary shifts out display window, video elementary is appeared in display window show, other information (such as video comments in user browser webpage, recommend video etc.) time can watch the beneficial effect of the play content in video elementary simultaneously.

Embodiment three

With reference to Fig. 3, it illustrates the player method of a kind of video elements in webpage of the present invention, specifically can comprise:

Step 310, gets the web document with video elementary from web page server side, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

As Fig. 3 A, it is the example of browser loaded and displayed web document; S312 is browser display form, and S313 is the display window of video elementary, and S314 is scroll bar, and S315 is rolling groove, and the miscellaneous part of browser omits at this.In embodiments of the present invention, Fig. 3 A is after web document has loaded, original state schematic diagram when user is not also dragged by user, and namely browser has loaded web document, any onscroll event also do not detected.Wherein, the current display position of window shown in S313 is the initial display position of video elementary.

Step 320, according to webpage overall size, the display position of scroll bar and the display position of webpage current browser display window, determines the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

When the render engine renders html document of browser, the height of the page after playing up generally all can be greater than the height of display window S312, and the rolling of scroll bar is than the height change of regular meeting according to the page.Described rolling ratio is the Npx of the every rolling 1px page scroll of scroll bar.The integer of N >=1.

So the present invention can according to the height a of the page, the height b of display window, and the length f of scroll bar calculates described rolling ratio g, and its computing formula can be g=a/ (b-f).Namely the ratio of rolling in rolling groove between rotatable length and the height of the page is calculated.

The height of web document can be obtained in embodiments of the present invention, i.e. a by document.body.scrollHeight function; Obtain the height of display window by document.body.clientHeight function, i.e. b, obtain the height of scroll bar with GetScrollInfo function, i.e. c.

Step 330, obtain in described video elementary display position, the height value in video elementary altitude range is to the distance threshold L at display window top;

In embodiments of the present invention, can select to be blocked in a part for video elementary, then to perform subsequent logic with the mode playback of wicket.Namely can select a position in the scope of the high q of video elementary, calculate and when start to enter fenestella play mode.

In such as Fig. 3 A, select at the high half q/2 place of video elementary, namely namely the video elementary half that has been blocked enters fenestella pattern, so first needs the distance L at technology display window top to video elementary q/2 place.

In embodiments of the present invention, the value obtaining described L has multiple method, obtains the distance k at the video elementary upper left corner to display window top, then k+q/2=L as by getBoundingClientRect () method.

According to described rolling ratio and distance threshold L, step 340, determines that scroll bar needs the first threshold of rolling;

After acquisition L, only need the first threshold of the rolling calculating scroll bar.Such as rolling ratio is 1:10, i.e. scroll bar rolling 1px, page scroll 10px, L=200px, so L*1/10=20px, and also namely scroll bar needs rolling 20px.

Step 350, judges whether the distance C that scroll bar rolls reaches first threshold; When the distance C that scroll bar rolls reaches first threshold, then judge the display of described video elementary part and/or be not shown fully.

As previous example, when scroll bar has rolled 20px distance, namely judge the display of described video elementary part and/or be not shown fully, reaching the moment needing to enter wicket play mode, enter step 360.As shown in Figure 3 B, start at the moment to enter fenestella play mode by step 360, in the wicket S316 namely in Fig. 3 B, play video content.As long as user down slides at the moment always, fenestella pattern just exists always.When judge video elementary or whole be presented in display window time, then keep the initial presentation state of webpage.

When just can be triggered by onsroll event in embodiments of the present invention, obtain the top attribute p1 (i.e. distance page top distance) of scroll bar, then top attribute p2 described in Real-time Obtaining in rolling process, can learn scroll bar rolling distance by p2-p1.

Certainly, if after page original upload, user triggers onsroll event first time, can directly using top property value as scroll bar rolling distance.

If scroll bar is not rolled to 20px.Do not need to enter wicket play mode described in then judging, carry out step 360.

Step 320-step 350 can be understood as the embodiment " according to display position, the display position of display window, the display position of scroll bar, the size attribute of page entirety of video elementary, judging that described video elementary part in current browser display window shows and/or is not shown fully " in embodiment one.

Step 360, judge the display of described video elementary part and/or be not shown fully, then display position and the display layer index of described video elementary revised by described display and control script, makes to be shown by top set in the current web page of described video elementary in current browser display window.

In step 350, when the distance C that scroll bar rolls reaches first threshold, namely judge the display of described video elementary part and/or be not shown fully.

Step 370, according to the scroll bar event that user triggers, judges the initial display position whether all showing described video elementary in described display window; If so, then the video elementary of current display position is reduced to initial display position.

Preferably, obtain in described video elementary display position, the height value in video elementary altitude range comprises to the distance threshold L at display window top:

Sub-step 331, after webpage has loaded, when user triggers scroll bar event for the first time, calculates described distance threshold L.

In embodiments of the present invention, after webpage has loaded, before user does not do any operation to webpage, in described video elementary display position, the height value in video elementary altitude range has been fixing to the distance threshold L at display window top.

Now, for the video elementary using absolute fix, its top value (video elementary top is to the distance at webpage top), the same with video elementary top to the distance at display window top, therefore the described top value of video elementary can directly be obtained, add the triggering height of the video elementary of selection, just enter when such as hiding q/2 and start to enter fenestella play mode, so L=top value+q/2;

Then L calculates first threshold in conjunction with rolling ratio, after this step, first threshold described in very little memory headroom record can be distributed, now only need the top attribute obtaining scroll bar, by the top attribute of scroll bar, compare with the first threshold of record and can judge whether to enter fenestella play mode, or judge to be reduced to initial webpage pattern from fenestella play mode.Its computing velocity is fast, does not need follow-up in calculating rolling ratio, L value, and first threshold.

Other values of L also can be set in embodiments of the present invention, such as L=top value, i.e. the distance at video elementary distance from top display window top, for judging that display window beginning is shown.Also can arrange L=top value+q, namely video elementary starts all not to be shown.The pattern that all can enter in Fig. 3 B when part is all shown and/or when not all being shown and video elementary is adjusted to S316 wicket and play is judged as in video elementary.

The present invention and embodiment one, the step principle that embodiment two is similar are similar, are not described in detail in this.The similar step of the embodiment of the present invention and embodiment one, embodiment two also can be diverted in the present embodiment, and concrete principle no longer describes in detail.

The part that the embodiment of the present invention can select video elementary not show has how many times, just enters fenestella play mode.

Embodiment four

With reference to Fig. 4, it illustrates the player method of preferably a kind of video elements in webpage of the present invention, specifically can comprise:

Step 410, gets the web document with video elementary from web page server side, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

Step 420, according to webpage overall size, the display position of scroll bar and the display position of webpage current browser display window, determines the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

Step 430, obtains the distance threshold A of top to display window top of described video elementary display position;

The distance at this distance threshold A and video elementary top to display window top.

According to described rolling ratio and distance threshold A, step 440, determines that scroll bar needs the Second Threshold rolled;

Step 450, judges whether the distance C that scroll bar rolls reaches Second Threshold; When the distance C that scroll bar rolls reaches Second Threshold, then judge that described video elementary part shows.

After judging the display of described video elementary part, enter step 460.

On the basis of Fig. 3 A, the present embodiment is changed to Fig. 4 A, when overlapping with display window top bottom video elementary, namely enters fenestella play mode.The wherein example of browser loaded and displayed web document; S412 is browser display form, and S413 is the display window of former video elements in webpage, and S414 is scroll bar, and S415 is rolling groove, and the miscellaneous part of browser omits at this.Now can trigger wicket Mode S 416, as long as user down slides at the moment always, wicket pattern just exists always.When judge video elementary or whole be presented in display window time, then keep the initial presentation state of webpage.

Step 420-step 450 can be understood as the embodiment " according to display position, the display position of display window, the display position of scroll bar, the size attribute of page entirety of video elementary, judging that described video elementary part in current browser display window shows and/or is not shown fully " in embodiment one.

Step 460, judges that described video elementary part shows, then display position and the display layer index of described video elementary revised by described display and control script, makes to be shown by top set in the current web page of described video elementary in current browser display window.

In step 450, when the distance C that scroll bar rolls reaches Second Threshold, namely judge that described video elementary part shows.

Preferably, described step 430 comprises:

Sub-step 431, after webpage has loaded, when user triggers scroll bar event for the first time, calculates described distance threshold A.

Preferably, described display and control script revises display position and the display layer index of described video elementary, after making to be shown by top set in the current web page of described video elementary in current browser display window, also comprises:

Sub-step 432, according to the scroll bar event that user triggers, judges the initial display position whether all showing described video elementary in described display window; If so, then the video elementary of current display position is reduced to initial display position.

Further, according to the scroll bar event that user triggers, judge the initial display position whether all showing described video elementary in described display window, comprising:

Sub-step 433, when after the display of video elementary beginning, according to the scroll bar event that user triggers, judges whether described scroll bar is less than described Second Threshold apart from the distance at described display window top; If be less than described Second Threshold, judge that described display window starts all to show the initial display position of described video elementary;

In embodiments of the present invention, can after webpage have loaded, user just calculates and records described Second Threshold before first time triggering onsroll event.If so follow-up user's upward sliding webpage, so can judge whether the distance at scroll bar distance from top display window top is less than the Second Threshold of described record, can judge that the initial display position of video elementary has appeared in display window, now video elementary can be reduced to its initial display position, fenestella play mode of stopping using.

The present invention and the similar step principle of embodiment one to embodiment three similar, be not described in detail in this.The similar step of the embodiment of the present invention and embodiment one to embodiment three also can be diverted in the present embodiment, and concrete principle no longer describes in detail.

The embodiment of the present invention is that video elementary starts to enter the embodiment entering fenestella play mode when not showing state completely.

Embodiment five

With reference to Fig. 5, it illustrates the player method of a kind of video elements in webpage of optimum of the present invention, specifically can comprise:

Step 510, gets the web document with video elementary from web page server side, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

Step 520, according to webpage overall size, the display position of scroll bar and the display position of webpage current browser display window, determines the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

Step 530, obtains the distance threshold B of top to display window top of described video elementary display position;

The height of this distance threshold to be video elementary top to the distance at display window top add video elementary.

Step 540; Determine that scroll bar needs the 3rd threshold value of rolling according to described rolling ratio and distance threshold B;

Step 550, when the distance C that scroll bar rolls reaches the 3rd threshold value, then judges that described video elementary is not shown fully.

After judging the display of described video elementary part, enter step 560.

On the basis of Fig. 3 A, the present embodiment is changed to Fig. 5 A, when video elementary top overlaps with display window top, namely enters fenestella play mode.The wherein example of browser loaded and displayed web document; S512 is browser display form, and S513 is the display window of former video elements in webpage, and S514 is scroll bar, and S515 is rolling groove, and the miscellaneous part of browser omits at this.Now can trigger wicket Mode S 516, as long as user down slides at the moment always, fenestella pattern just exists always.

Step 520-step 550 can be understood as the embodiment " according to display position, the display position of display window, the display position of scroll bar, the size attribute of page entirety of video elementary, judging that described video elementary part in current browser display window shows and/or is not shown fully " in embodiment one.

Step 560, judges that described video elementary is not shown fully, then display position and the display layer index of described video elementary revised by described display and control script, makes to be shown by top set in the current web page of described video elementary in current browser display window.

In step 550, in when scroll bar roll distance C reach the 3rd threshold value time, namely judge that described video elementary is not shown fully.

Preferably, described step 530 comprises:

Sub-step 531, after webpage has loaded, when user triggers scroll bar event for the first time, calculates described distance threshold B.

Sub-step 532, according to the scroll bar event that user triggers, judges the initial display position whether all showing described video elementary in described display window; If so, then the video elementary of current display position is reduced to initial display position.

Sub-step 532, when after the display of video elementary beginning, according to the scroll bar event that user triggers, judges whether described scroll bar is less than described 3rd threshold value apart from the distance at described display window top; If be less than described 3rd threshold value, judge that described display window starts all to show the initial display position of described video elementary;

In embodiments of the present invention, can after webpage have loaded, user just calculates and records described 3rd threshold value before first time triggering onsroll event.If so follow-up user's upward sliding webpage, so can judge whether the distance at scroll bar distance from top display window top is less than the 3rd threshold value of described record, can judge that the initial display position of video elementary has appeared in display window, now video elementary can be reduced to its initial display position, fenestella play mode of stopping using.

The present invention and the similar step principle of embodiment one to embodiment four similar, be not described in detail in this.The similar step of the embodiment of the present invention and embodiment one to embodiment four also can be diverted in the present embodiment, and concrete principle no longer describes in detail.

The embodiment of the present invention is the embodiment that video elementary enters fenestella play mode when starting not show completely.

Certainly, outside above-described embodiment, described display and control script is judged that described video elementary part in current browser display window shows and/or is not shown fully and also can be comprised:

By obtaining the distance at video elementary distance web document top L1, obtain web document by the height L2 rolled away by document.body.scrollTop function, (height that also namely webpage is hiding); Work as L1=L2, then video elementary starts the entering part display stage; And/or work as L1<L2<L1+L3, wherein L3 is video elementary height, then video elementary part display; And/or as L2 >=L1+L3, then video elementary enters the video elementary complete not shown stage.

Display position and the display layer index of described video elementary can be revised according to above-mentioned judged result, make to be shown by top set in the current web page of described video elementary in current browser display window.

Embodiment six

With reference to Fig. 6, it illustrates the playing device of a kind of video elements in webpage of the present invention, specifically can comprise:

Script load-on module 610, be suitable for the web document got from web page server side with video elementary, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

Display position judge module 620, is suitable for described display and control script and judges that described video elementary part in current browser display window shows and/or is not shown fully;

Display position change module 630, is suitable for carrying out independent display by described display and control script by the current web page of described video elementary in current browser display window.

Preferably, described display position change module 630 comprises:

Element position change module, is suitable for display position and the display layer index that described video elementary revised by described display and control script, makes to be shown by top set in the current web page of described video elementary in current browser display window.

Preferably, after display position change module 630, also comprise:

Associated video interface puies forward module, is suitable for the associated video information obtaining the video play in current video element; When listening to mouse-over to described video elementary display position, supplying described associated video information in video elementary display and click interface is provided.

Preferably, after display position change module 630, also comprise:

Functional structure provides module, is suitable for, when listening to mouse-over to described video elementary display position, loading and showing the functional interface for current video content; Described functional interface comprises download interface and/or shares interface and/or collection interface and/or call third party's video jukebox software plays at least one in described video content interface.

Preferably, after display position change module 630, also comprise:

Size changes module, is suitable for when listening to the dimension modifying operation for video elementary display position, according to the display size in drag motions amendment video elementary CSS file.

Preferably, before display position judge module 620, also comprise:

Select reminding module, be suitable for judging whether there is multiple video elementary in current web page; If existed, then the video elementary pointing out user to select to carry out fenestella display also provides option interface; For the unselected video elementary of user, stop judging that described video elementary part in current browser display window shows and/or is not shown fully.

Preferably, after display position change module 630, also comprise:

Suspending module, being suitable for, when listening to mouse-over to described video elementary display position, triggering the pausing operation to play content in described video elementary; After mouse shifts out described video elementary display position, then continue to play described video content.

Preferably, after display position change module 630, also comprise:

Position mobile module, is suitable for after the display position in described video elementary listens to drag motions, by the position of the display position of described video elementary along with drag motions moves.

Preferably, described position mobile module comprises:

Primary importance mobile module, is suitable for, in the CSS pattern of the described video elementary of correspondence, being changed by the positional parameter of video elementary along with the location parameter pulled in webpage window area.

Preferably, after described display position change module 630, also comprise:

Reduction judge module, is suitable for the scroll bar event triggered according to user, judges the initial display position whether all showing described video elementary in described display window; Be suitable for if then the video elementary of current display position is reduced to initial display position.

Preferably, described reduction judge module comprises:

CSS recovery module, being suitable for, in the CSS file of webpage HTML, being revised as at initial display position by the display position of the CSS pattern of described video elementary, is initial indexing parameter by the display layer index modification of described CSS pattern.

Embodiment seven

With reference to Fig. 7, it illustrates the playing device of a kind of video elements in webpage of the present invention, specifically can comprise:

Script load-on module 710, be suitable for the web document got from web page server side with video elementary, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

Display position judge module 720, is suitable for described display and control script and judges that described video elementary part in current browser display window shows and/or is not shown fully;

Preferably, described display position judge module 720 comprises:

First display position judge module, be suitable for the display position according to video elementary, the display position of display window, the display position of scroll bar, the size attribute of page entirety, judge that described video elementary part in current browser display window shows and/or is not shown fully.

Display position change module 730, described display position change module 730 comprises:

Element position change module 732, is suitable for display position and the display layer index that described video elementary revised by described display and control script, makes to be shown by top set in the current web page of described video elementary in current browser display window.

Preferably, described element position change module 732 comprises:

First element position change module, is suitable for display size in the display position of described video elementary to carry out convergent-divergent, is revised as by positional parameter in described display position in the current web page in current browser display window and shows.

Preferably, described first element position change module comprises:

Second element position change module, be suitable in the CSS file of webpage HTML, being revised as by the display position of the CSS pattern of described video elementary in the current web page in current browser display window and showing, is the indexing parameter of top layer by the display layer index modification of described CSS pattern.

Preferably, described second element position change module comprises:

First-phase, to modified module, is suitable for the CSS pattern for described video elementary, the relative ticker position of positional parameter in the display position of described CSS pattern is modified.

Preferably, described second element position change module comprises: comprising:

Second-phase, to modified module, is suitable for the CSS pattern for described video elementary, is modified relative for the positional parameter in the display position of described CSS pattern display window position.

Preferably, described element position change module comprises:

Module hidden by button, is suitable for the control knob in described video elementary to hide.

Embodiment eight

With reference to Fig. 8, it illustrates the playing device of a kind of video elements in webpage of the present invention, specifically can comprise:

Script load-on module 810, be suitable for the web document got from web page server side with video elementary, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

First display position judge module 820, described first display position judge module 820 comprises;

First rolling ratio computing module 822, is suitable for, according to webpage overall size, the display position of scroll bar and the display position of webpage current browser display window, determining the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

First rolling distance acquisition module 824, be suitable for obtaining in described video elementary display position, the height value in video elementary altitude range is to the distance threshold L at display window top;

First rolling threshold determination module 826, is suitable for determining that scroll bar needs the first threshold of rolling according to described rolling ratio and distance threshold L;

First element judge module 828, is suitable for when the distance C that scroll bar rolls reaches first threshold, then judging the display of described video elementary part and/or not being shown fully.

Display position change module 830, described display position change module 830 comprises: element position change module 832, be suitable for display position and the display layer index that described video elementary revised by described display and control script, make to be shown by top set in the current web page of described video elementary in current browser display window.

Preferably, after described display position change module 830, also comprise:

Embodiment nine

With reference to Fig. 9, it illustrates the playing device of the present invention's preferably a kind of video elements in webpage, specifically can comprise:

Script load-on module 910, be suitable for the web document got from web page server side with video elementary, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

First display position judge module 920, described first display position judge module 720 comprises;

Second rolling ratio computing module 922, is suitable for, according to webpage overall size, the display position of scroll bar and the display position of webpage current browser display window, determining the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

Second rolling distance acquisition module 924, is suitable for obtaining the distance threshold A of top to display window top of described video elementary display position;

Preferably, described second rolling distance acquisition module 924 comprises:

First triggers computing module, is suitable for after webpage has loaded, when user triggers scroll bar event for the first time, calculates described distance threshold A.

Second rolling threshold determination module 926, is suitable for determining that scroll bar needs the Second Threshold rolled according to described rolling ratio and distance threshold A;

Part display judge module 928, is suitable for when the distance C that scroll bar rolls reaches Second Threshold, then judging that described video elementary part shows.

Display position change module 930, described display position change module 930 comprises: element position change module 932, be suitable for display position and the display layer index that described video elementary revised by described display and control script, make to be shown by top set in the current web page of described video elementary in current browser display window.

Preferably, after described display position change module 730, also comprise:

Preferably, described reduction judge module comprises:

First reduction judge module, is suitable for, when after the display of video elementary beginning, according to the scroll bar event that user triggers, judging whether described scroll bar is less than described Second Threshold apart from the distance at described display window top; If be less than described Second Threshold, judge that described display window starts all to show the initial display position of described video elementary;

Embodiment ten

With reference to Figure 10, it illustrates the playing device of a kind of video elements in webpage of optimum of the present invention, specifically can comprise:

Script load-on module 1010, be suitable for the web document got from web page server side with video elementary, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

First display position judge module 1020, described first display position judge module 1020 comprises;

3rd rolling ratio computing module 1022, is suitable for, according to webpage overall size, the display position of scroll bar and the display position of webpage current browser display window, determining the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

3rd rolling distance acquisition module 1024, is suitable for obtaining the distance threshold B of top to display window top of described video elementary display position;

Preferably, described second rolling distance acquisition module 1024 comprises:

First triggers computing module, is suitable for after webpage has loaded, when user triggers scroll bar event for the first time, calculates described distance threshold B.

3rd rolling distance acquisition module 1026, is suitable for obtaining the distance threshold B of bottom to display window top of described video elementary display position;

All do not show judge module 1028, be suitable for when the distance C that scroll bar rolls reaches the 3rd threshold value, then judging that described video elementary part shows.

Display position change module 1030, described display position change module 1030 comprises: element position change module 1032, be suitable for display position and the display layer index that described video elementary revised by described display and control script, make to be shown by top set in the current web page of described video elementary in current browser display window.

Preferably, after described display position change module 1030, also comprise:

Preferably, described reduction judge module comprises:

First reduction judge module, is suitable for, when after the display of video elementary beginning, according to the scroll bar event that user triggers, judging whether described scroll bar is less than described 3rd threshold value apart from the distance at described display window top; If be less than described 3rd threshold value, judge that described display window starts all to show the initial display position of described video elementary;

Embodiment 11

With reference to Figure 11, it illustrates the Play System of a kind of video elements in webpage of optimum of the present invention, specifically can comprise:

Client browser 1110 and server 1120;

Described server 110 is suitable for, and with in the web document of video elementary, adds display and control script; For controlling client browser 1110, described display and control script judges that described video elementary part in current browser display window shows and/or is not shown fully, and state display position and the display layer index that described video elementary revised by display and control script, make to be shown by top set in the current web page of described video elementary in current browser display window.

Described client browser 1110 comprises:

Script load-on module 1112, be suitable for the web document got from web page server side with video elementary, and loaded and displayed is current web page, with the display and control script for described video elementary in wherein said web document;

Display position judge module 1114, is suitable for described display and control script and judges that described video elementary part in current browser display window shows and/or is not shown fully;

Display position change module 1116, is suitable for carrying out independent display by described display and control script by the current web page of described video elementary in current browser display window.

The display and control script that certain described server adds can also comprise other any logics mentioned in embodiment one to embodiment ten, and corresponding client browser also can load the execution module of respective logic according to described script.

Intrinsic not relevant to any certain computer, virtual system or miscellaneous equipment with display at this algorithm provided.Various general-purpose system also can with use based on together with this teaching.According to description above, the structure constructed required by this type systematic is apparent.In addition, the present invention is not also for any certain programmed language.It should be understood that and various programming language can be utilized to realize content of the present invention described here, and the description done language-specific is above to disclose preferred forms of the present invention.

In instructions provided herein, describe a large amount of detail.But can understand, embodiments of the invention can be put into practice when not having these details.In some instances, be not shown specifically known method, structure and technology, so that not fuzzy understanding of this description.

Similarly, be to be understood that, in order to simplify the disclosure and to help to understand in each inventive aspect one or more, in the description above to exemplary embodiment of the present invention, each feature of the present invention is grouped together in single embodiment, figure or the description to it sometimes.But, the method for the disclosure should be construed to the following intention of reflection: namely the present invention for required protection requires feature more more than the feature clearly recorded in each claim.Or rather, as claims below reflect, all features of disclosed single embodiment before inventive aspect is to be less than.Therefore, the claims following embodiment are incorporated to this embodiment thus clearly, and wherein each claim itself is as independent embodiment of the present invention.

Those skilled in the art are appreciated that and adaptively can change the module in the equipment in embodiment and they are arranged in one or more equipment different from this embodiment.Module in embodiment or unit or assembly can be combined into a module or unit or assembly, and multiple submodule or subelement or sub-component can be put them in addition.Except at least some in such feature and/or process or unit be mutually repel except, any combination can be adopted to combine all processes of all features disclosed in this instructions (comprising adjoint claim, summary and accompanying drawing) and so disclosed any method or equipment or unit.Unless expressly stated otherwise, each feature disclosed in this instructions (comprising adjoint claim, summary and accompanying drawing) can by providing identical, alternative features that is equivalent or similar object replaces.

In addition, those skilled in the art can understand, although embodiments more described herein to comprise in other embodiment some included feature instead of further feature, the combination of the feature of different embodiment means and to be within scope of the present invention and to form different embodiments.Such as, in the following claims, the one of any of embodiment required for protection can use with arbitrary array mode.

All parts embodiment of the present invention with hardware implementing, or can realize with the software module run on one or more processor, or realizes with their combination.It will be understood by those of skill in the art that and microprocessor or digital signal processor (DSP) can be used in practice to realize according to the embodiment of the present invention the broadcasting of video elements in webpagethe some or all functions of the some or all parts in equipment.The present invention can also be embodied as part or all ground equipment or device program (such as, computer program and computer program) for performing method as described herein.Realizing program of the present invention and can store on a computer-readable medium like this, or the form of one or more signal can be had.Such signal can be downloaded from internet website and obtain, or provides on carrier signal, or provides with any other form.

The present invention will be described instead of limit the invention to it should be noted above-described embodiment, and those skilled in the art can design alternative embodiment when not departing from the scope of claims.In the claims, any reference symbol between bracket should be configured to limitations on claims.Word " comprises " not to be got rid of existence and does not arrange element in the claims or step.Word "a" or "an" before being positioned at element is not got rid of and be there is multiple such element.The present invention can by means of including the hardware of some different elements and realizing by means of the computing machine of suitably programming.In the unit claim listing some devices, several in these devices can be carry out imbody by same hardware branch.Word first, second and third-class use do not represent any order.Can be title by these word explanations.

The invention discloses the player method of A1, a kind of video elements in webpage, comprising:

A2, method as described in A1, describedly carry out independent display by described display and control script by the current web page of described video elementary in current browser display window:

Described display and control script revises display position and the display layer index of described video elementary, makes to be shown by top set in the current web page of described video elementary in current browser display window.

A3, method as described in A2, the part display and/or be not shown fully in current browser display window of described video elementary judged by described display and control script, comprising:

According to display position, the display position of display window, the display position of scroll bar, the size attribute of page entirety of video elementary, judge that described video elementary part in current browser display window shows and/or is not shown fully.

A4, method as described in A3, according to display position, the display position of display window, the display position of scroll bar, the size attribute of page entirety of video elementary, judge that described video elementary part in current browser display window shows and/or is not shown fully and comprise:

According to webpage overall size, the display position of scroll bar and the display position of webpage current browser display window, determine the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

Obtain in described video elementary display position, the height value in video elementary altitude range is to the distance threshold L at display window top;

Determine that scroll bar needs the first threshold of rolling according to described rolling ratio and distance threshold L;

When the distance C that scroll bar rolls reaches first threshold, then judge the display of described video elementary part and/or be not shown fully.

A5, method as described in A3, according to display position, the display position of display window, the display position of scroll bar, the size attribute of page entirety of video elementary, judge that the part display in current browser display window of described video elementary comprises:

Obtain the distance threshold A of top to display window top of described video elementary display position;

Determine that scroll bar needs the Second Threshold rolled according to described rolling ratio and distance threshold A;

When the distance C that scroll bar rolls reaches Second Threshold, then judge that described video elementary part shows.

A6, method as described in A3, according to display position, the display position of display window, the display position of scroll bar, the size of page entirety of video elementary, judge that described video elementary is not shown fully in current browser display window and comprise:

According to webpage overall size attribute, the display position of scroll bar and the display position of webpage current browser display window, determine the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

Obtain the distance threshold B of bottom to display window top of described video elementary display position;

Determine that scroll bar needs the 3rd threshold value of rolling according to described rolling ratio and distance threshold B;

When the distance C that scroll bar rolls reaches the 3rd threshold value, then judge that described video elementary is not shown fully.

A7, method as described in A5, the top obtaining described video elementary display position comprises to the distance threshold A at display window top:

After webpage has loaded, when user triggers scroll bar event for the first time, calculate described distance threshold A.

A8, method as described in A6, the top of the described video elementary display position of described acquisition comprises to the distance threshold B at display window top:

After webpage has loaded, when user triggers scroll bar event for the first time, calculate described distance threshold B.

A9, method as described in A5 or A6, described by described display and control script by after carrying out independence display in the current web page of described video elementary in current browser display window, also comprise:

According to the scroll bar event that user triggers, judge the initial display position whether all showing described video elementary in described display window; If so, then the video elementary of current display position is reduced to initial display position.

Whether all A10, method as described in A9, according to the scroll bar event that user triggers, judge the initial display position of the described video elementary of display in described display window, comprising:

When after the display of video elementary beginning, according to the scroll bar event that user triggers, judge whether described scroll bar is less than described Second Threshold apart from the distance at described display window top; If be less than described Second Threshold, judge that described display window starts all to show the initial display position of described video elementary;

Or, after video elementary starts not to be shown fully, according to the scroll bar event that user triggers, judge whether described scroll bar is less than described 3rd threshold value apart from the distance at described display window top; If be less than described 3rd threshold value, judge that described display window starts all to show the initial display position of described video elementary.

A11, method as described in A9, be reduced to initial display position by described video elementary and comprise:

In the CSS file of webpage HTML, being revised as at initial display position by the display position of the CSS pattern of described video elementary, is initial indexing parameter by the display layer index modification of described CSS pattern.

A12, method as described in A2, described display and control script revises display position and the display layer index of described video elementary, makes to be shown by top set in the current web page of described video elementary in current browser display window, comprising:

Display size in the display position of described video elementary is carried out convergent-divergent, positional parameter in described display position is revised as in the current web page in current browser display window and shows.

A13, method as described in A2, described display and control script revises display position and the display layer index of described video elementary, makes to be comprised by top set display in the current web page of described video elementary in current browser display window:

In the CSS file of webpage HTML, being revised as by the display position of the CSS pattern of described video elementary in the current web page in current browser display window and showing, is the indexing parameter of top layer by the display layer index modification of described CSS pattern.

A14, method as described in A12, be revised as the display position of the CSS pattern of described video elementary in the current web page in current browser display window to show and comprise:

For the CSS pattern of described video elementary, the relative ticker position of positional parameter in the display position of described CSS pattern is modified.

A15, method as described in A12, be revised as the display position of the CSS pattern of described video elementary in the current web page in current browser display window to show and comprise:

For the CSS pattern of described video elementary, is modified in relative for the positional parameter in the display position of described CSS pattern display window position.

A16, method as described in A2, described display and control script revises display position and the display layer index of described video elementary, makes to be comprised by top set display in the current web page of described video elementary in current browser display window:

Control knob in described video elementary is hidden.

A17, method as described in A1, by described display and control script by after carrying out independence display in the current web page of described video elementary in current browser display window, also comprise:

Obtain the associated video information of the video play in current video element; When listening to mouse-over to described video elementary display position, supplying described associated video information in video elementary display and click interface is provided.

A18, method as described in A1, by described display and control script by after carrying out independence display in the current web page of described video elementary in current browser display window, also comprise:

When listening to mouse-over to described video elementary display position, loading and showing the functional interface for current video content; Described functional interface comprises download interface and/or shares interface and/or collection interface and/or call third party's video jukebox software plays at least one in described video content interface.

A19, method as described in A1, by described display and control script by after carrying out independence display in the current web page of described video elementary in current browser display window, also comprise:

When listening to the dimension modifying operation for video elementary display position, according to the display size in drag motions amendment video elementary CSS file.

A20, method as described in A1, judge the part display and/or before not being shown fully in current browser display window of described video elementary at described display and control script, also comprise:

Judge whether there is multiple video elementary in current web page; If existed, then the video elementary pointing out user to select to carry out fenestella display also provides option interface; For the unselected video elementary of user, stop judging that described video elementary part in current browser display window shows and/or is not shown fully.

A21, method as described in A1, by described display and control script by after carrying out independence display in the current web page of described video elementary in current browser display window, also comprise:

When listening to mouse-over to described video elementary display position, trigger the pausing operation to play content in described video elementary; After mouse shifts out described video elementary display position, then continue to play described video content.

A22, method as described in A1, by described display and control script by after carrying out independence display in the current web page of described video elementary in current browser display window, also comprise:

After the display position in described video elementary listens to drag motions, by the position of the display position of described video elementary along with drag motions moves.

A23, method as described in A22, comprise the position of the display position of described video elementary along with drag motions moves:

In the CSS pattern of the described video elementary of correspondence, the positional parameter of video elementary is changed along with the location parameter pulled in webpage window area.

The invention also discloses the playing device of a kind of B24, a kind of video elements in webpage, comprising:

B25, device as described in B24, described display position change module comprises:

B26, device as described in B25, described display position judge module comprises:

B27, device as described in B26, described first display position judge module comprises:

First rolling ratio computing module, is suitable for, according to webpage overall size, the display position of scroll bar and the display position of webpage current browser display window, determining the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

First rolling distance acquisition module, be suitable for obtaining in described video elementary display position, the height value in video elementary altitude range is to the distance threshold L at display window top;

First rolling threshold determination module, is suitable for determining that scroll bar needs the first threshold of rolling according to described rolling ratio and distance threshold L;

First element judge module, is suitable for when the distance C that scroll bar rolls reaches first threshold, then judging the display of described video elementary part and/or not being shown fully.

B28, device as described in B26, described first display position judge module comprises:

Second rolling ratio computing module, is suitable for, according to webpage overall size, the display position of scroll bar and the display position of webpage current browser display window, determining the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

Second rolling distance acquisition module, is suitable for obtaining the distance threshold A of top to display window top of described video elementary display position;

Second rolling threshold determination module, is suitable for determining that scroll bar needs the Second Threshold rolled according to described rolling ratio and distance threshold A;

Part shows judge module, is suitable for when the distance C that scroll bar rolls reaches Second Threshold, then judging that described video elementary part shows.

B29, device as described in B26, described first display position judge module comprises:

3rd rolling distance acquisition module, is suitable for, according to webpage overall size attribute, the display position of scroll bar and the display position of webpage current browser display window, determining the rolling ratio between the rolling distance of scroll bar and the rolling distance of webpage;

3rd rolling distance acquisition module, is suitable for obtaining the distance threshold B of bottom to display window top of described video elementary display position;

3rd rolling threshold determination module, is suitable for determining that scroll bar needs the 3rd threshold value of rolling according to described rolling ratio and distance threshold B;

All do not show judge module, be suitable for when the distance C that scroll bar rolls reaches the 3rd threshold value, then judging that described video elementary is not shown fully.

B30, device as described in B28, described second rolling distance acquisition module comprises:

B31, device as described in B29, described 3rd rolling distance acquisition module comprises:

Second triggers computing module, is suitable for after webpage has loaded, when user triggers scroll bar event for the first time, calculates described distance threshold B.

B32, as the device of B28 or B29 as described in it, after described display position change module, also to comprise:

B33, method as described in B32, described reduction judge module comprises:

Or the second reduction judge module, is suitable for, after video elementary starts not to be shown fully, according to the scroll bar event of user's triggering, judging whether described scroll bar is less than described 3rd threshold value apart from the distance at described display window top; If be less than described 3rd threshold value, judge that described display window starts all to show the initial display position of described video elementary.

B34, method as described in B32, described reduction judge module comprises:

B35, device as described in B25, described element position change module comprises:

B36, device as described in B24, described display position change module comprises:

B37, device as described in B36, described second element position change module comprises:

B38, device as described in B36, described second display position change module comprises: comprising:

B39, device as described in B25, described element position change module comprises:

B40, device as described in B24, after display position change module, also comprise:

B41, device as described in B24, after display position change module, also comprise:

B42, device as described in B24, after display position change module, also comprise:

B43, device as described in B24, before display position judge module, also comprise:

B44, device as described in B24, after display position change module, also comprise:

B45, device as described in B24, after display position change module, also comprise:

B46, device as described in B44, described position mobile module comprises:

Claims

1. a player method for video elements in webpage, comprising:

2. the method for claim 1, is characterized in that, describedly carries out independent display by described display and control script by the current web page of described video elementary in current browser display window:

3. method as claimed in claim 2, is characterized in that, described display and control script judges that described video elementary part in current browser display window shows and/or is not shown fully, comprising:

4. method as claimed in claim 3, it is characterized in that, according to display position, the display position of display window, the display position of scroll bar, the size attribute of page entirety of video elementary, judge that described video elementary part in current browser display window shows and/or is not shown fully and comprise:

5. method as claimed in claim 3, it is characterized in that, according to display position, the display position of display window, the display position of scroll bar, the size attribute of page entirety of video elementary, judge that the part display in current browser display window of described video elementary comprises:

6. method as claimed in claim 3, it is characterized in that, according to display position, the display position of display window, the display position of scroll bar, the size of page entirety of video elementary, judge that described video elementary is not shown fully in current browser display window and comprise:

7. method as claimed in claim 5, is characterized in that, the top obtaining described video elementary display position comprises to the distance threshold A at display window top:

8. method as claimed in claim 6, is characterized in that, the top of the described video elementary display position of described acquisition comprises to the distance threshold B at display window top:

9. the method as described in claim 5 or 6, is characterized in that, described by described display and control script by after carrying out independence display in the current web page of described video elementary in current browser display window, also comprise:

10. a playing device for video elements in webpage, comprising: