WO2018036544A1 - 浏览器在独立窗口中播放视频的方法、装置及存储介质 - Google Patents

浏览器在独立窗口中播放视频的方法、装置及存储介质 Download PDF

Info

Publication number
WO2018036544A1
WO2018036544A1 PCT/CN2017/098840 CN2017098840W WO2018036544A1 WO 2018036544 A1 WO2018036544 A1 WO 2018036544A1 CN 2017098840 W CN2017098840 W CN 2017098840W WO 2018036544 A1 WO2018036544 A1 WO 2018036544A1
Authority
WO
WIPO (PCT)
Prior art keywords
video
window
page
browser
user
Prior art date
Application number
PCT/CN2017/098840
Other languages
English (en)
French (fr)
Inventor
李准
Original Assignee
腾讯科技（深圳）有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 腾讯科技（深圳）有限公司 filed Critical 腾讯科技（深圳）有限公司
Publication of WO2018036544A1 publication Critical patent/WO2018036544A1/zh
Priority to US16/201,840 priority Critical patent/US10839137B2/en

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/103—Formatting, i.e. changing of presentation of documents
    • G06F40/106—Display of layout of documents; Previewing
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/957—Browsing optimisation, e.g. caching or content distillation
    • G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/431—Generation of visual interfaces for content selection or interaction; Content or additional data rendering
    • H04N21/4312—Generation of visual interfaces for content selection or interaction; Content or additional data rendering involving specific graphical features, e.g. screen layout, special fonts or colors, blinking icons, highlights or animations
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/47—End-user applications
    • H04N21/472—End-user interface for requesting content, additional data or services; End-user interface for interacting with content, e.g. for content reservation or setting reminders, for requesting event notification, for manipulating displayed content
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/80—Generation or processing of content or additional data by content creator independently of the distribution process; Content per se
    • H04N21/85—Assembly of content; Generation of multimedia applications
    • H04N21/854—Content authoring
    • H04N21/8543—Content authoring using a description language, e.g. Multimedia and Hypermedia information coding Expert Group [MHEG], eXtensible Markup Language [XML]
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/431—Generation of visual interfaces for content selection or interaction; Content or additional data rendering
    • H04N21/4312—Generation of visual interfaces for content selection or interaction; Content or additional data rendering involving specific graphical features, e.g. screen layout, special fonts or colors, blinking icons, highlights or animations
    • H04N21/4314—Generation of visual interfaces for content selection or interaction; Content or additional data rendering involving specific graphical features, e.g. screen layout, special fonts or colors, blinking icons, highlights or animations for fitting data in a restricted space on the screen, e.g. EPG data in a rectangular grid
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/443—OS processes, e.g. booting an STB, implementing a Java virtual machine in an STB or power management in an STB
    • H04N21/4438—Window management, e.g. event handling following interaction with the user interface
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/47—End-user applications
    • H04N21/478—Supplemental services, e.g. displaying phone caller identification, shopping application
    • H04N21/4782—Web browsing, e.g. WebTV

Definitions

  • the present application relates to the field of computer technologies, and in particular, to a method, an apparatus, and a storage medium for a browser to play video in a separate window.
  • Hypertext Markup Language (English full name: Hyper Text Markup Language, English abbreviation: HTML) is widely used in web pages. Most of the web pages that users see online are written in HTML. Hypertext means that the page can include non-text elements such as video, picture, link, music, program, etc. The mark means that the hypertext must be marked by the beginning and end of the attribute, and the browser can decode the HTML. The content of the web page is displayed.
  • Plug-ins are programs written in accordance with a certain specification of the application interface.
  • the browser can directly call the plug-in to process a specific type of file.
  • Flash is widely used as a standard for interactive vector graphics and web animation. Flash is an authoring software for animation creation and application development. It can build rich media-like Flash by adding images, sounds, videos and special effects. application.
  • Flash technology can be used to implement online video streaming, and the browser can play Flash video through the Flash Player plugin.
  • the plug-in is first downloaded from the plug-in server, and then the plug-in is installed and installed in the browser, which causes the operation process to be complicated, and the plug-in is updated. Scenario, then you need to re-install the plug-in in the browser, or install the update package, which makes the plug-in installed in the browser to solve the problem of complicated operation when playing video.
  • H5 in the fifth major revision of Hypertext Markup Language, the H5 standard specification, H5 provides a new framework and platform for the next generation Internet, but the H5 standard specification does not support the use of the Flash plugin to play video, resulting in In the H5 page, the video cannot be played by installing the plugin.
  • the embodiment of the present invention provides a method, a device, and a storage medium for a browser to play a video in a separate window.
  • the video can be played in a separate window without installing a plug-in in the browser, and the implementation process is simple and easy to operate.
  • the embodiment of the present application provides the following technical solutions:
  • the embodiment of the present application provides a method for a browser to play a video in a separate window, where the method is executed by a processor disposed in a terminal, including:
  • the embodiment of the present application further provides an apparatus for playing video in a separate window, including one or more processors and a storage medium storing operation instructions when operating an operation instruction in the storage medium.
  • the processor performs the following steps:
  • a computer readable storage medium having program instructions for performing the method as described above is stored on the computer readable storage medium.
  • the embodiments of the present application have the following advantages:
  • a full display style can be applied to the video element, so that the current page in the webpage
  • the displayed video content can fill the video area of the webpage, and the video content displayed in the video area can be transferred to the created independent window to continue playing.
  • the video element in the webpage is directly used to configure the full display style.
  • FIG. 1 is a schematic block diagram of a method for a browser to play a video in a separate window according to an embodiment of the present disclosure
  • FIG. 2 is a schematic diagram of an implementation process of a browser playing a video in a separate window according to an embodiment of the present disclosure
  • FIG. 3A is a schematic diagram of a browser display for implementing video content of a video element in a browser according to an embodiment of the present application
  • 3B is a schematic diagram of detecting a mobile operation of a user controlled mouse in a browser provided by an embodiment of the present application
  • 3C is a schematic diagram of a play interface of a browser playing a video in a separate window according to an embodiment of the present disclosure
  • FIG. 4A is a schematic structural diagram of a device for playing a video in a separate window by a browser according to an embodiment of the present disclosure
  • 4B is a schematic structural diagram of a working position determining module according to an embodiment of the present application.
  • 4C is a schematic structural diagram of another apparatus for playing a video in a separate window according to an embodiment of the present application.
  • 4D is a schematic structural diagram of another apparatus for playing a video in a separate window according to an embodiment of the present application.
  • 4E is a schematic structural diagram of another apparatus for playing a video in a separate window according to an embodiment of the present application.
  • 4F is a schematic structural diagram of another apparatus for playing a video in a separate window according to an embodiment of the present application.
  • FIG. 5 is a schematic structural diagram of a method for applying a video played by a browser in a separate window to a terminal according to an embodiment of the present disclosure.
  • the embodiment of the present invention provides a method and a device for a browser to play a video in a separate window.
  • the video can be played in a separate window without installing a plug-in in the browser, and the implementation process is simple and easy to operate.
  • An embodiment of the method for playing a video in a separate window of the present application which can be applied to an application scenario in which a video in a browser is played through a separate window, as shown in FIG. 1 , which is provided by an embodiment of the present application.
  • the method for the browser to play the video in a separate window may include the following steps:
  • hypertext content such as videos, pictures, hyperlinks, and the like are displayed in the webpage of the browser.
  • the user can operate on the webpage of the browser.
  • the user can use the mouse and the keyboard to operate the webpage, and the movement of the mouse on the webpage indicates the content of the webpage that the user needs to operate.
  • the user can operate the webpage page through the touch screen, and the user can indicate the content of the page to be operated by clicking, sliding, and the like.
  • the operation location indicated by the user is detected in real time to determine the location of the corresponding page in the webpage page indicated by the current user.
  • the corresponding video area can be configured according to the video element in the webpage page.
  • the operation location indicated by the user is in the video area in the webpage page.
  • the video area configured in the web page is a rectangular area.
  • the operation position may be determined to be in the video area, otherwise the operation position is not in the video area.
  • step 101 detects an operation location indicated by a user in a webpage page of the browser, and may include the following steps:
  • A1 generating a mouse movement event according to a user's movement operation of controlling a mouse in a webpage of the browser
  • a mouse movement event is detected in the webpage page to generate an operation location indicated by the user.
  • the operation position indicated by the user can be determined by the user controlling the mouse. For example, if the user controls the mouse to move in the webpage of the browser, the mouse movement event is generated according to the movement operation of the user to control the mouse, and the operation position indicated by the user can be obtained by analyzing the mouse movement event.
  • the operation position specified by the user in the embodiment of the present application may not be limited to the movement of the mouse, and may also refer to the operation position determined by the user through the movement of the cursor in the keyboard, or may be determined by the user clicking the click event detection in the touch screen. The operating position.
  • the method for playing the video in the independent window by the browser may further include the following step:
  • step 102 is triggered to execute: acquiring a video element corresponding to the operation position in the web page.
  • the user may be prompted to create a separate window through the webpage page, for example, prompting the user to open the video content in the popup window.
  • step 102 is triggered to execute. Otherwise the process ends.
  • the video element corresponding to the operation location in the webpage is acquired.
  • the video element configured in the video area can be obtained.
  • the video element can also be defined as a multimedia play element, and the video element can be used to implement video file playback in the browser.
  • the video element may include a fifth generation application hypertext markup language, ie a video element configured in an H5 web page.
  • Video elements can be used to play videos on the web. With video elements, you don't need to use plugins in your browser. You only need to use video elements to complete the playback of video files.
  • a specific cascading style sheet (English full name: Cascading Style Sheets, CSS) may be applied to the video element, wherein the video content is filled in.
  • a full display style (English name: Fullview Style) may be pre-configured, and the full display style is a CSS that implements a page filling effect, and the full display is applied in the video element.
  • the video content currently displayed in the web page can be filled with the video area according to the video element of the full display style. For example, the video content currently displayed on the webpage page only occupies part of the video area of the page.
  • the full display style configured in the video element can fill the video content currently displayed in the webpage page, that is, the layout of the current webpage page.
  • the entire webpage area can be occupied.
  • the current webpage page refers to a webpage page that the user is viewing through the browser, for example, the user clicks on the webpage link to newly open a webpage including the video content.
  • the full display style is applied in the video element, so that the video area in the current webpage page can fill the currently displayed video content, and the video content played in the current webpage page is displayed according to the currently applied video element.
  • the method for playing a video in a separate window by the browser provided by the embodiment of the present application after the step 103 is to fill the video area currently displayed in the web page according to the video element of the full display style. It can also include the following steps:
  • the entire webpage page may be re-arranged according to a predetermined pattern of the system, and after the layout is completed, the re-layout webpage page is displayed, thereby applying in the video area.
  • the layout is re-adjusted to make it more suitable for the user to browse the webpage.
  • the specific layout mode can be determined in combination with the application scenario, which is not limited herein.
  • a separate window may be created, and the independent window is created by the current webpage of the browser.
  • the independent window is used to carry the video content displayed in the video area of the webpage page, and the video content originally displayed in the video area can be transferred to the independent window for playing.
  • the playback of the video content in the independent window does not need to be completed by the built-in video plug-in in the browser, and the load operation caused by the frequent update of the plug-in is avoided, and the playback of the video in the independent window is completed by the self-characteristics of the webpage.
  • the process is simple and easy to operate.
  • the step 104 creates a separate window that is different from the web page, and after the video content displayed in the video area is transferred to the independent window for playing, the browser provided by the embodiment of the present application is in a separate window.
  • the method of playing a video may further include the following steps:
  • D1 remove the full display style from the video element, and apply the default layout style to the video element
  • step D1 is performed first.
  • the full display style is no longer applied, but the video elements are configured according to the default layout style.
  • the video content currently played in the independent window is transferred to the video area of the webpage page, and then the independent window is closed, and the video content played in the independent window is restored to the video area of the webpage page, and finally the default layout according to the application can be used.
  • the styled video element re-layouts the webpage page and displays the re-layout webpage page.
  • the video content can be restored from the independent window to the video area of the webpage page to continue. Play, users can still browse through the video area Frequency content.
  • the step 104 creates a separate window that is different from the web page, and after the video content displayed in the video area is transferred to the independent window for playing, the embodiment of the present application
  • the method for providing a browser to play a video in a separate window may further include the following steps:
  • step E1 determining whether the closed window operation sent by the user on the independent window is detected, and when detecting the closing window operation, triggering the following step D1: removing the full display style from the video element, and applying the default layout style to In the video element.
  • step D1 Before performing step D1, it is also possible to detect whether the user has issued a close window operation. If the closed window operation is detected, step D1 may be performed in response to the user's shutdown indication. You can continue to use a separate window to play video content.
  • the full display style can be applied to the video element in the embodiment of the present application, so that the video content currently displayed in the webpage page can fill the video area of the webpage page, and the video area is displayed in the video area.
  • the video content can be transferred to the created independent window to continue playing.
  • the video element in the web page is used to configure the full display style to complete the video playback in the independent window, so there is no need to install the video in the browser.
  • the plug-in plays the video, avoiding the load operation caused by the frequent update of the plug-in.
  • the playback of the video in the independent window is completed by the self-characteristics of the webpage, and the implementation process is simple and easy to operate.
  • the following application scenarios are specifically illustrated.
  • the ⁇ video> tag of HTML5 can be used to realize the playback of the online video stream.
  • the technique of playing Flash video in a separate window in the prior art cannot support the ⁇ video> video in HTML5.
  • the independent video playback function of the browser can be implemented to support the ⁇ video> video of the HTML5.
  • HTML5 video is defined by the HTML5 standard. It is implemented by the browser that supports HTML5.
  • Flash is implemented by the plug-in mechanism of the browser. Flash Player plug-in is required to enable Flash video playback.
  • FIG. 2 is a schematic diagram of an application scenario of a browser playing a video in a separate window according to an embodiment of the present disclosure.
  • the online video stream in the ⁇ video> tag of HTML5 can be played through a separate window.
  • HTML5 is a new generation of HTML that can build web pages with richer content.
  • ⁇ video> is a new tag introduced by HTML5 to define online video streams.
  • CSS is a computer language used to represent file styles such as HTML or XML (a subset of the standard universal markup language) that can be used to control the style and layout of web pages.
  • a stand-alone window is a visual window that is independent of the main window of the browser.
  • the main browser window can refer to the page window that the user opens through the browser.
  • the interface style is inconsistent with the browser's main window.
  • MiniWindow is a table of independent windows in technical implementation Show, Fullview indicates that the layout of an element of the page fills the visible area of the current page, FullviewStyle is the CSS that can achieve the Fullview effect, and Browser is responsible for the display of the browser interface and the management of the page.
  • BrowserView is an important sub-module in the Browser, responsible for user operation processing, communication with RenderView, Render rendering result rendering and new window display.
  • Render is a renderer that is responsible for the rendering of the web page and submits the rendered results of the page to the Browser for display.
  • the CSS that can implement the Fullview effect is first built in the browser, that is, the FullviewStyle.
  • the Browser detects that the current mouse has entered the video area defined by the ⁇ video> tag.
  • a prompt is displayed to prompt the user that the video can be played through a separate window. If the user selects to play the video through a separate window according to the prompt, the Browser will notify the Render that the video needs to be displayed in a separate window, and the Render will have the built-in FullviewStyle application.
  • FIG. 3A is a schematic diagram of a browser display for realizing video content of a video element in a browser provided by an embodiment of the present application, for example, a QQ browser rendering is implemented by using a ⁇ video> tag of HTML5.
  • FIG. 3B is a schematic diagram of detecting a movement operation of a user-controlled mouse in a browser provided by an embodiment of the present application. A prompt for displaying a mouse when entering a video area is shown in FIG. 3B.
  • FIG. 3C is a schematic diagram of a playback interface of a browser playing a video in a separate window according to an embodiment of the present invention.
  • the ⁇ video> video in the HTML5 is displayed in a separate window and is a browser-independent new window, which is used to display the HTML5 video corresponding.
  • the BrowserView generates a mouse event MouseMoveEvent according to the current mouse position, and then passes the mouse event to the RenderView through the interprocess communication (English full name: Inter-Process Communication, English abbreviation: IPC) message, and the Browser and the Renderer can send message notifications to each other through the IPC. Achieve communication.
  • IPC Inter-Process Communication
  • the RenderView receives the mouse event MouseMoveEvent passed by the BrowserView through the IPC, and calls the HandleMouseMoveEvent related method of the Frame corresponding to the webpage page according to the mouse position information in the event;
  • HandleMouseMoveEvent When Frame is called HandleMouseMoveEvent, first call its own HitTest method to find the video element corresponding to the position in the mouse event. If the element type is HTML5 ⁇ video> video, call RenderView's MouseEnterVideoElement method and make the element Record, which is convenient for subsequent operations to find the element directly, which is the Video in the timing diagram;
  • BrowserView After receiving the IPC message of MouseEnterVideoElementEvent, BrowserView calls its own ShowMiniWindowTipBar method to display the prompt message and operation method of entering MiniWindow to the user;
  • the user operates according to the prompt and enters a separate window to display the video mode
  • the BrowserView sends the ShowHTMLVideoInMiniVideoEvent IPC message to the RenderView.
  • the Frame After the Frame is called the EnterFullview method, the Frame calls the RequestFullview method of the Video element.
  • the FullviewStyle is applied to the Video element, and then the Frame's NeedLayout method is called.
  • RenderLayout method of RenderView After the RenderLayout method of RenderView is called, it calls its own Layout method to re-layout the entire web page, and sends the EnterCiniVideoModeEvent IPC message to the BrowserView.
  • BrowserView After receiving the IPC message of EnterMiniVideoModeEvent, BrowserView first calls CreateMiniWindow to create a separate video window MiniWindow, then removes the current web page from the browser window, and then calls ShowMiniWindow to display the web page to the newly created independent window.
  • MiniWindow calls the MiniWindowClosed method of the BrowserView
  • RenderView calls its own Layout method to re-layout the entire page.
  • the built-in FullviewStyle in the embodiment of the present application adds a new built-in CSS to the browser, and locates a specific page element according to the mouse position, thereby realizing the ⁇ video> tag of the page by the mouse.
  • the embodiment of the present application can implement the default CSS style of applying FullviewStyle to the ⁇ video> tag and restoring ⁇ video>, and realize the message notification between the Render and the Browser by using the mouse to locate the ⁇ video> element in the page in the Render, and implement the Browser.
  • Render applies the built-in FullviewStyle to the ⁇ video> element, re-lays the entire web page, fills the ⁇ video> element with the visible area of the current browser page, and then notifies the Browser to display the page into a separate window.
  • the independent window is closed, the page is displayed in the original browser main window, and the Render is notified to restore the ⁇ video> CSS and re-layout.
  • the user can provide a better online video viewing effect.
  • the apparatus 400 for playing a video in a separate window in the embodiment of the present application may include: an operation location determining module 401, a video element acquiring module 402, a full display style application module 403, and a video. a playing module 404, wherein
  • the operation location determining module 401 is configured to detect an operation location indicated by the user in the webpage page of the browser, and determine whether the operation location is in a video area in the webpage page;
  • the video element obtaining module 402 is configured to acquire a video element corresponding to an operation position in the webpage page if the operation location is in the video area;
  • the full display style application module 403 is configured to apply the preset full display style to the video element, and fill the video area with the video content currently displayed in the webpage according to the video element of the full display style;
  • the video playing module 404 is configured to create a separate window that is different from the webpage page, and transfer the video content displayed in the video area to a separate window for playing.
  • the operation position determining module 401 includes:
  • the event generating module 4011 is configured to generate a mouse movement event according to a user's movement operation of controlling a mouse in a webpage of the browser;
  • the event detecting module 4012 is configured to detect a mouse movement event in the webpage page to generate an operation location indicated by the user.
  • the apparatus 400 for a browser to play a video in a separate window further includes:
  • the first instruction detection module 405 is configured to determine whether the operation location is after the video area in the webpage page, and if the operation location is in the video area, prompt the user whether to create a separate window, and when the user indication is obtained, the user needs to create When the window is independent, the execution of the video element acquisition module 402 is triggered.
  • the apparatus 400 for a browser to play a video in a separate window further includes:
  • the first re-layout module 406 is configured to re-lay the webpage page after the full-display style application module 403 fills the video content currently displayed in the webpage page according to the video element of the full display style, and displays the re-layout after the re-layout Page page.
  • the apparatus 400 for a browser to play a video in a separate window further includes:
  • the full display style removal module 407 is configured to create a separate window different from the webpage page by the video playing module 404. After the video content displayed in the video area is transferred to a separate window for playing, the full display style is shifted from the video element. Remove and apply the default layout style to the video element;
  • the video recovery module 408 is configured to transfer the currently played video content in the independent window to the video area of the webpage, and then close the independent window;
  • the second re-layout module 409 is configured to re-layout the webpage according to the video element of the default layout style, and display the re-layout webpage.
  • the apparatus 400 for playing a video in a separate window by the browser as shown in FIG. 4E, further includes:
  • the second instruction detecting module 410 is configured to create a separate window different from the webpage page by the video playing module 404, and after the video content displayed in the video area is transferred to the independent window for playing, determine whether the user is detected to be sent on the independent window.
  • the close window operation triggers execution of the full display style removal module 407 when a close window operation is detected.
  • the full display style can be applied to the video element in the embodiment of the present application, so that the video content currently displayed in the webpage page can fill the video area of the webpage page, and the video content displayed in the video area. You can transfer to the created independent window to continue playing.
  • the video element in the web page is used to configure the full display style to complete the video playback in the independent window, so there is no need to install the video playing plugin in the browser.
  • the video is played to avoid the load operation caused by the frequent update of the plug-in.
  • the playback of the video in the independent window is completed by the self-characteristics of the webpage, and the implementation process is simple and easy to operate.
  • the embodiment of the present application further provides another terminal. As shown in FIG. 5, for the convenience of description, only the part related to the embodiment of the present application is shown. If the specific technical details are not disclosed, please refer to the method part of the embodiment of the present application. .
  • the terminal may be any terminal device including a mobile phone, a tablet computer, a PDA (Personal Digital Assistant), a POS (Point of Sales), an in-vehicle computer, and the like.
  • FIG. 5 is a block diagram showing a partial structure of a mobile phone related to a terminal provided by an embodiment of the present application.
  • the mobile phone includes: a radio frequency (RF) circuit 1010, a memory 1020, an input unit 1030, a display unit 1040, a sensor 1050, an audio circuit 1060, a wireless fidelity (WiFi) module 1070, and a processor 1080. And power supply 1090 and other components.
  • RF radio frequency
  • the structure of the handset shown in FIG. 5 does not constitute a limitation to the handset, and may include more or less components than those illustrated, or some components may be combined, or different components may be arranged.
  • the RF circuit 1010 can be used for receiving and transmitting signals during and after receiving or transmitting information, in particular, after receiving downlink information of the base station, and processing it to the processor 1080; in addition, designing uplink data transmission To the base station.
  • RF circuit 1010 includes, but is not limited to, an antenna, at least one amplifier, a transceiver, a coupler, a Low Noise Amplifier (LNA), a duplexer, and the like.
  • LNA Low Noise Amplifier
  • RF circuit 1010 can also communicate with the network and other devices via wireless communication.
  • the above wireless communication may use any communication standard or protocol, including but not limited to Global System of Mobile communication (GSM), General Packet Radio Service (GPRS), Code Division Multiple Access (Code Division). Multiple Access (CDMA), Wideband Code Division Multiple Access (WCDMA), Long Term Evolution (LTE), E-mail, Short Messaging Service (SMS), and the like.
  • GSM Global System of Mobile communication
  • GPRS General Packet Radio Service
  • the memory 1020 can be used to store software programs and modules, and the processor 1080 executes various functions and data processing for performing the methods described herein, as well as the terminals, by running software programs and modules stored in the memory 1020.
  • the memory 1020 may mainly include a storage program area and a storage data area, wherein the storage program area may store an operating system, an application required for at least one function (such as a sound playing function, an image playing function, etc.), and the like; the storage data area may be stored according to Data created by the use of the mobile phone (such as audio data, phone book, etc.).
  • memory 1020 can include high speed random access memory, and can also include non-volatile memory, such as at least one magnetic disk storage device, flash memory device, or other volatile solid state storage device.
  • the input unit 1030 can be configured to receive input numeric or character information and to generate key signal inputs related to user settings and function controls of the handset.
  • the input unit 1030 may include a touch panel 1031 and other input devices 1032.
  • the touch panel 1031 also referred to as a touch screen, can collect touch operations on or near the user (such as the user using a finger, a stylus, or the like on the touch panel 1031 or near the touch panel 1031. Operation), and drive the corresponding connecting device according to a preset program.
  • the touch panel 1031 may include two parts: a touch detection device and a touch controller.
  • the touch detection device detects the touch orientation of the user, and detects a signal brought by the touch operation, and transmits the signal to the touch controller; the touch controller receives the touch information from the touch detection device, converts the touch information into contact coordinates, and sends the touch information.
  • the processor 1080 is provided and can receive commands from the processor 1080 and execute them.
  • the touch panel 1031 can be implemented in various types such as resistive, capacitive, infrared, and surface acoustic waves.
  • the input unit 1030 may also include other input devices 1032.
  • other input devices 1032 may include, but are not limited to, one or more of a physical keyboard, function keys (such as volume control buttons, switch buttons, etc.), trackballs, mice, joysticks, and the like.
  • the display unit 1040 can be used to display information input by the user or information provided to the user as well as various menus of the mobile phone.
  • the display unit 1040 may include a display panel 1041, optionally, may adopt a liquid crystal display
  • the display panel 1041 is configured in the form of a Liquid Crystal Display (LCD), an Organic Light-Emitting Diode (OLED), or the like.
  • the touch panel 1031 may cover the display panel 1041, and when the touch panel 1031 detects a touch operation thereon or nearby, the touch panel 1031 transmits to the processor 1080 to determine the type of the touch event, and then the processor 1080 according to the touch event.
  • the type provides a corresponding visual output on display panel 1041.
  • touch panel 1031 and the display panel 1041 are used as two independent components to implement the input and input functions of the mobile phone in FIG. 5, in some embodiments, the touch panel 1031 and the display panel 1041 may be integrated. Realize the input and output functions of the phone.
  • the handset can also include at least one type of sensor 1050, such as a light sensor, motion sensor, and other sensors.
  • the light sensor may include an ambient light sensor and a proximity sensor, wherein the ambient light sensor may adjust the brightness of the display panel 1041 according to the brightness of the ambient light, and the proximity sensor may close the display panel 1041 and/or when the mobile phone moves to the ear. Or backlight.
  • the accelerometer sensor can detect the magnitude of acceleration in all directions (usually three axes). When it is stationary, it can detect the magnitude and direction of gravity.
  • the mobile phone can be used to identify the gesture of the mobile phone (such as horizontal and vertical screen switching, related Game, magnetometer attitude calibration), vibration recognition related functions (such as pedometer, tapping), etc.; as for the mobile phone can also be configured with gyroscopes, barometers, hygrometers, thermometers, infrared sensors and other sensors, no longer Narration.
  • the gesture of the mobile phone such as horizontal and vertical screen switching, related Game, magnetometer attitude calibration
  • vibration recognition related functions such as pedometer, tapping
  • the mobile phone can also be configured with gyroscopes, barometers, hygrometers, thermometers, infrared sensors and other sensors, no longer Narration.
  • An audio circuit 1060, a speaker 1061, and a microphone 1062 can provide an audio interface between the user and the handset.
  • the audio circuit 1060 can transmit the converted electrical data of the received audio data to the speaker 1061, and convert it into a sound signal output by the speaker 1061; on the other hand, the microphone 1062 converts the collected sound signal into an electrical signal, by the audio circuit 1060. After receiving, it is converted into audio data, and then processed by the audio data output processor 1080, sent to the other mobile phone via the RF circuit 1010, or outputted to the memory 1020 for further processing.
  • WiFi is a short-range wireless transmission technology.
  • the mobile phone through the WiFi module 1070 can help users to send and receive e-mail, browse the web and access streaming media, etc. It provides users with wireless broadband Internet access.
  • FIG. 5 shows the WiFi module 1070, it can be understood that it does not belong to the essential configuration of the mobile phone, and may be omitted as needed within the scope of not changing the essence of the invention.
  • the processor 1080 is the control center of the handset, which connects various portions of the entire handset using various interfaces and lines, by executing or executing software programs and/or modules stored in the memory 1020, and invoking data stored in the memory 1020, The phone's various functions and processing data, so that the overall monitoring of the phone.
  • the processor 1080 may include one or more processing units; preferably, the processor 1080 may integrate an application processor and a modem processor, where the application processor mainly processes the operating system The modem, the user interface, the application, etc., the modem processor mainly handles wireless communication. It will be appreciated that the above described modem processor may also not be integrated into the processor 1080.
  • the mobile phone also includes a power source 1090 (such as a battery) that supplies power to various components.
  • a power source 1090 such as a battery
  • the power source can be logically coupled to the processor 1080 through a power management system to manage functions such as charging, discharging, and power management through the power management system.
  • the mobile phone may further include a camera, a Bluetooth module, and the like, and details are not described herein again.
  • the processor 1080 included in the terminal further has a method flow for controlling execution by the terminal.
  • the device embodiments described above are merely illustrative, wherein the units described as separate components may or may not be physically separated, and the components displayed as units may or may not be Physical units can be located in one place or distributed to multiple network elements. Some or all of the modules may be selected according to actual needs to achieve the purpose of the solution of the embodiment.
  • the connection relationship between the modules indicates that there is a communication connection between them, and specifically may be implemented as one or more communication buses or signal lines.
  • the present application provides a computer readable storage medium having stored thereon program instructions for performing the above method.
  • the technical solution of the present application can be embodied in the form of a software product in essence or in the form of a software product stored in a readable storage medium, such as a floppy disk of a computer, a USB disk, and a mobile device.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Signal Processing (AREA)
  • Multimedia (AREA)
  • Human Computer Interaction (AREA)
  • Data Mining & Analysis (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Computer Security & Cryptography (AREA)
  • User Interface Of Digital Computer (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

本申请公开了一种浏览器在独立窗口中播放视频的方法、装置和存储介质，不需要在浏览器中安装插件即可实现在独立窗口中播放视频，实现过程简单易操作。所述浏览器在独立窗口中播放视频的方法包括：检测浏览器的网页页面中用户指示的操作位置，判断所述操作位置是否处于所述网页页面中的视频区域；若所述操作位置处于所述视频区域内，获取在所述网页页面内的所述操作位置对应的视频元素；将预置的全显示样式应用到所述视频元素中，并根据应用所述全显示样式的视频元素将所述网页页面中当前显示的视频内容填满所述视频区域；创建与所述网页页面不相同的独立窗口，将所述视频区域内显示的视频内容转移到所述独立窗口中进行播放。

Description

浏览器在独立窗口中播放视频的方法、装置及存储介质
本申请要求于2016年8月26日提交中国专利局、申请号为201610740979.5、发明名称为“一种浏览器在独立窗口中播放视频的方法和装置”的中国专利申请的优先权，其全部内容通过引用结合在本申请中。
技术领域
本申请涉及计算机技术领域，尤其涉及一种浏览器在独立窗口中播放视频的方法、装置以及存储介质。
背景技术
超文本标记语言(英文全称：Hyper Text Markup Language，英文简称：HTML)网页应用广泛，目前用户上网所看到的网页，多数都是由HTML编写而成。超文本是指页面内可以包括视频、图片、链接、音乐、程序等非文字元素，标记指的是这些超文本必须由包括属性的开头与结尾标志来标记，浏览器通过解码HTML，就可以把网页内容显示出来。
目前的HTML页面中经常使用浏览器插件，插件是一种遵循一定规范的应用程序接口编写出来的程序，浏览器能够直接调用插件程序，用于处理特定类型的文件。例如Flash作为交互式矢量图和网页动画的标准被广泛使用，Flash是一种动画创作与应用程序开发于一身的创作软件，可以通过添加图片、声音、视频和特殊效果构建出包括丰富媒体的Flash应用程序。在网页中可以利用Flash技术实现在线视频流，浏览器通过Flash Player插件来播放Flash视频。但是在HTML页面中安装插件以解决视频播放的方案中，需要先从插件服务器中下载到插件程序，然后在浏览器中安装运行插件程序，从而导致操作过程复杂，并且插件程序还会存在更新的场景，那么就需要在浏览器中重新安装插件程序，或者安装更新包，这些都使得在浏览器中安装插件以解决视频播放时存在操作复杂的问题。又如，在超文本标记语言的第五次重大修改即H5标准规范中，H5为下一代互联网提供了全新的框架和平台，但是该H5标准规范中不支持使用Flash插件来播放视频，从而导致在H5页面中无法通过安装插件的方式来实现视频的播放。
发明内容
本申请实施例提供了一种浏览器在独立窗口中播放视频的方法、装置以及存储介质，不需要在浏览器中安装插件即可实现在独立窗口中播放视频，实现过程简单易操作。
为解决上述技术问题，本申请实施例提供以下技术方案：
第一方面，本申请实施例提供一种浏览器在独立窗口中播放视频的方法，所述方法由设置在终端中的处理器执行，包括：
检测浏览器的网页页面中用户指示的操作位置，判断所述操作位置是否处于所述网页页面中的视频区域；
若所述操作位置处于所述视频区域内，获取在所述网页页面内的所述操作位置对应的视频元素；
将预置的全显示样式应用到所述视频元素中，从而将所述网页页面中当前显示的视频内容填满所述视频区域；
创建与所述网页页面不相同的独立窗口，并将所述视频区域内显示的视频内容转移到所述独立窗口中进行播放。
第二方面，本申请实施例还提供一种浏览器在独立窗口中播放视频的装置，包括一个或多个处理器和存储有操作指令的存储介质，当运行所述存储介质中的操作指令时，所述处理器执行如下步骤：
检测浏览器的网页页面中用户指示的操作位置，判断所述操作位置是否处于所述网页页面中的视频区域；
若所述操作位置处于所述视频区域内，获取在所述网页页面内的所述操作位置对应的视频元素；
将预置的全显示样式应用到所述视频元素中，从而将所述网页页面中当前显示的视频内容填满所述视频区域；
创建与所述网页页面不相同的独立窗口，并将所述视频区域内显示的视频内容转移到所述独立窗口中进行播放。
第三方面，提供了一种计算机可读存储介质，在所述计算机可读存储介质上存储有用于执行如上所述的方法的程序指令。
从以上技术方案可以看出，本申请实施例具有以下优点：
在本申请实施例中视频元素中可以应用全显示样式，从而网页页面中当前 显示的视频内容可以填满网页页面的视频区域，视频区域内显示的视频内容可以转移到创建好的独立窗口中继续进行播放，本申请实施例中直接使用网页页面中的视频元素配置全显示样式来完成独立窗口中的视频播放，因此无需在浏览器中安装视频播放插件来播放视频，避免插件经常更新导致的负载操作，视频在独立窗口中的播放都是通过网页页面的自身特性来完成，实现过程简单易操作。
附图说明
为了更清楚地说明本申请实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域的技术人员来讲，还可以根据这些附图获得其他的附图。
图1为本申请实施例提供的一种浏览器在独立窗口中播放视频的方法的流程方框示意图；
图2为本申请实施例提供的浏览器在独立窗口中播放视频的一种实现过程的示意图；
图3A为本申请实施例提供的浏览器中视频元素实现在线视频的浏览器显示示意图；
图3B为本申请实施例提供的浏览器中检测用户控制鼠标的移动操作示意图；
图3C为本申请实施例提供的浏览器在独立窗口中播放视频的播放界面示意图；
图4A为本申请实施例提供的一种浏览器在独立窗口中播放视频的装置的组成结构示意图；
图4B为本申请实施例提供的操作位置判断模块的组成结构示意图；
图4C为本申请实施例提供的另一种浏览器在独立窗口中播放视频的装置的组成结构示意图；
图4D为本申请实施例提供的另一种浏览器在独立窗口中播放视频的装置的组成结构示意图；
图4E为本申请实施例提供的另一种浏览器在独立窗口中播放视频的装置的组成结构示意图；
图4F为本申请实施例提供的另一种浏览器在独立窗口中播放视频的装置的组成结构示意图；
图5为本申请实施例提供的浏览器在独立窗口中播放视频的方法应用于终端的组成结构示意图。
具体实施方式
本申请实施例提供了一种浏览器在独立窗口中播放视频的方法和装置，不需要在浏览器中安装插件即可实现在独立窗口中播放视频，实现过程简单易操作。
为使得本申请的发明目的、特征、优点能够更加的明显和易懂，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，下面所描述的实施例仅仅是本申请一部分实施例，而非全部实施例。基于本申请中的实施例，本领域的技术人员所获得的所有其他实施例，都属于本申请保护的范围。
本申请的说明书和权利要求书及上述附图中的术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包括，以便包括一系列单元的过程、方法、系统、产品或设备不必限于那些单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它单元。
以下分别进行详细说明。本申请浏览器在独立窗口中播放视频的方法的一个实施例，具体可以应用于浏览器中的视频通过独立窗口实现播放的应用场景中，请参阅图1所示，本申请一个实施例提供的浏览器在独立窗口中播放视频的方法，可以包括如下步骤：
101、检测浏览器的网页页面中用户指示的操作位置，判断操作位置是否处于网页页面中的视频区域。
在本申请实施例中，浏览器的网页页面中显示有超文本内容，例如视频、图片、超链接等。用户可以对浏览器的网页页面进行操作，例如用户可以使用鼠标和键盘来操作网页页面，鼠标在网页页面上的移动指示了用户需要操作的页面内容。又如用户可以通过触摸屏来操作网页页面，用户可以通过点击、滑动等操作来指示需要操作的页面内容。本申请实施例中浏览器的网页页面中对用户指示的操作位置进行实时检测，以确定当前用户指示的操作位置在网页页面中对应的页面位置。在网页页面中可以根据视频元素配置对应的视频区域， 从而判断用户指示的操作位置是否处于网页页面中的视频区域内。举例说明，在网页页面中配置的视频区域为长方形区域，当用户指示的操作位置进入该视频区域的范围内时可以确定该操作位置处于视频区域内，否则该操作位置没有在视频区域内。
在本申请的一些实施例中，步骤101检测浏览器的网页页面中用户指示的操作位置，可以包括如下步骤：
A1、根据用户在浏览器的网页页面中控制鼠标的移动操作生成鼠标移动事件；
A2、在网页页面中检测鼠标移动事件从而生成用户指示的操作位置。
其中，用户指示的操作位置可以通过用户控制鼠标来确定。例如，用户控制鼠标在浏览器的网页页面中移动，则根据用户控制鼠标的移动操作生成鼠标移动事件，通过对该鼠标移动事件的分析可以获取到用户指示的操作位置。不限定的是，本申请实施例中用户指定的操作位置可以不限于鼠标的移动，也可以指用户通过键盘中光标的移动确定出的操作位置，还可以是用户点击触摸屏中的点击事件检测确定出的操作位置。
需要说明的是，在本申请的一些实施例中，步骤101中判断操作位置是否处于网页页面中的视频区域之后，本申请实施例提供的浏览器在独立窗口中播放视频的方法还可以包括如下步骤：
B1、若操作位置处于视频区域内，向用户提示是否创建独立窗口，当获取到用户指示需要创建独立窗口时，触发如下步骤102执行：获取在网页页面内的操作位置对应的视频元素。
其中，当检测到操作位置处于视频区域内时，可以通过网页页面提示用户是否创建独立窗口，例如提示用户是否在弹出窗口中打开视频内容，当用户确定可以创建独立窗口时，再触发步骤102执行，否则结束整个流程。通过向用户提示是否创建独立窗口，可以实现按照用户的指令进行独立窗口播放视频，当用户指示无需使用独立窗口时则可以不创建独立窗口。
102、若操作位置处于视频区域内，获取在网页页面内的操作位置对应的视频元素。
在本申请实施例中，当检测到用户指示的操作位置处于网页页面的视频区域内，则说明在网页页面中需要进行视频播放，此时获取在网页页面内的操作位置对应的视频元素。例如可以在网页页面中为视频元素定义视频区域，当用 户指示的操作位置进入该视频区域内时可以获取到该视频区域所配置的视频元素。该视频元素也可以定义为多媒体播放元素，视频元素可以用于实现浏览器中的视频文件播放。例如，视频元素可以包括：第五代应用超文本标记语言即H5网页中配置的video元素。视频元素可以用于播放网络上的视频，使用视频元素就不需要在浏览器中再使用插件，只需要通过视频元素就可以完成视频文件的播放。
103、将预置的全显示样式应用到视频元素中，并根据应用全显示样式的视频元素将网页页面中当前显示的视频内容填满视频区域。
在本申请实施例中，获取到网页页面中配置的视频元素之后，对于该视频元素可以应用特定的层叠样式表(英文全称：Cascading Style Sheets，英文简称：CSS)，其中为了实现视频内容填满当前网页页面的可视区域，本申请实施例中可以预先配置全显示样式(英文名称：Fullview Style)，该全显示样式是一种实现页面填满效果的CSS，在视频元素中应用该全显示样式之后，可以根据应用全显示样式的视频元素将网页页面中当前显示的视频内容填满视频区域。举例说明，网页页面中当前显示的视频内容只占用页面的部分视频区域，通过视频元素中配置的全显示样式，可以将网页页面中当前显示的视频内容填满视频区域，即当前网页页面的布局可以占满整个视频区域，当前网页页面指的是用户通过浏览器正在查看的网页页面，例如用户点击网页链接新打开的一个包括有视频内容的网页。通过视频元素中应用全显示样式，使得当前网页页面中的视频区域内能够填满当前显示的视频内容，对当前网页页面中播放视频内容按照当前应用的视频元素进行布局显示。
在本申请的一些实施例中，步骤103根据应用全显示样式的视频元素将网页页面中当前显示的视频内容填满视频区域之后，本申请实施例提供的浏览器在独立窗口中播放视频的方法还可以包括如下步骤：
C1、对网页页面进行重新布局，并显示重新布局后的网页页面。
其中，在网页页面的视频区域中填满当前显示的视频内容之后，还可以按照系统预先确定的样式重新布局整个网页页面，在布局完成之后来显示重新布局后的网页页面，从而在视频区域应用新配置的视频元素后重新进行布局调整，以更适合用户来浏览该网页页面，具体采用的布局方式可以结合应用场景来确定，此处不做限定。
104、创建与网页页面不相同的独立窗口，将视频区域内显示的视频内容转 移到独立窗口中进行播放。
在本申请实施例中，通过前述步骤103对当前网页页面的视频区域中显示的视频内容进行填满显示之后，可以创建一独立窗口，该独立窗口是独立于浏览器的当前网页页面，通过创建的独立窗口来承载在网页页面的视频区域内显示的视频内容，原本在视频区域内显示的视频内容，可以转移到该独立窗口中进行播放。通过新创建的独立窗口来继续播放视频内容，可以为用户提供更好的在线视频观看效果。并且视频内容在独立窗口中的播放不需要通过在浏览器中内置视频插件来完成，避免插件经常更新导致的负载操作，视频在独立窗口中的播放都是通过网页页面的自身特性来完成，实现过程简单易操作。
在本申请的一些实施例中，步骤104创建与网页页面不相同的独立窗口，将视频区域内显示的视频内容转移到独立窗口中进行播放之后，本申请实施例提供的浏览器在独立窗口中播放视频的方法还可以包括如下步骤：
D1、从视频元素中将全显示样式移除掉，并将默认布局样式应用到视频元素中；
D2、将独立窗口中当前播放的视频内容转移到网页页面的视频区域内，然后关闭掉独立窗口；
D3、根据应用默认布局样式的视频元素对网页页面进行重新布局，并显示重新布局后的网页页面。
在本申请的前述实施例中描述了创建独立窗口来播放视频内容的实现方式，当步骤104执行完成之后，还可以执行步骤D1至步骤D3中对独立窗口的关闭操作，即首先执行步骤D1，将全显示样式从视频元素中移除掉，并将默认布局样式应用到视频元素中，通过对视频元素中样式的重配置，不再应用全显示样式，而是按照默认布局样式来配置视频元素，然后将独立窗口中当前播放的视频内容转移到网页页面的视频区域内，然后关闭掉独立窗口，把在独立窗口中播放的视频内容还原到网页页面的视频区域内，最后可以根据应用默认布局样式的视频元素对网页页面进行重新布局，并显示重新布局后的网页页面，通过步骤D1至步骤D3的独立窗口关闭操作，可以使得视频内容从独立窗口中还原到网页页面的视频区域内继续进行播放，用户仍可以通过视频区域来浏览视频内容。
在本申请的另一些实施例中，步骤104创建与网页页面不相同的独立窗口，将视频区域内显示的视频内容转移到独立窗口中进行播放之后，本申请实施例 提供的浏览器在独立窗口中播放视频的方法还可以包括如下步骤：
E1、判断是否检测到用户在独立窗口上发送的关闭窗口操作，当检测到关闭窗口操作时，触发执行如下步骤D1：从视频元素中将全显示样式移除掉，并将默认布局样式应用到视频元素中。
其中，在执行步骤D1之前，还可以先检测用户是否下发了关闭窗口操作，若检测到该关闭窗口操作，则可以响应用户的关闭指示来执行步骤D1，若没有检测到关闭窗口操作，则可以继续使用独立窗口来播放视频内容。
通过以上实施例对本申请实施例的描述可知，在本申请实施例中视频元素中可以应用全显示样式，从而网页页面中当前显示的视频内容可以填满网页页面的视频区域，视频区域内显示的视频内容可以转移到创建好的独立窗口中继续进行播放，本申请实施例中直接使用网页页面中的视频元素配置全显示样式来完成独立窗口中的视频播放，因此无需在浏览器中安装视频播放插件来播放视频，避免插件经常更新导致的负载操作，视频在独立窗口中的播放都是通过网页页面的自身特性来完成，实现过程简单易操作。
为便于更好的理解和实施本申请实施例的上述方案，下面举例相应的应用场景来进行具体说明。接下来以浏览器中支持H5页面的实现为例，在HTML5技术中，可以利用HTML5的<video>标签来实现在线视频流的播放。现有技术中在独立窗口中播放Flash视频的技术不能支持HTML5中<video>视频。本申请实施例中可以实现浏览器的独立窗口播放视频功能对HTML5的<video>视频的支持。HTML5视频是HTML5标准定义的，是由支持HTML5的浏览器本身来实现视频的播放的，而Flash是通过浏览器的插件机制来实现，需要安装Flash播放器插件才可以实现Flash视频的播放。
请参阅图2所示，为本申请实施例提供的浏览器在独立窗口中播放视频的一种应用场景示意图。本申请实施例中能通过独立窗口来播放HTML5的<video>标签中的在线视频流。首先对图2中出现的术语进行说明，HTML5是新一代的HTML，可以构建内容更加丰富的网页。<video>是HTML5引入的新标签，用于定义在线的视频流。CSS是一种用来表现HTML或XML(标准通用标记语言的一个子集)等文件样式的计算机语言，可以用来控制网页的样式和布局。独立窗口是独立于浏览器主窗口的可视窗口，此例中的浏览器主窗口可以指的是用户通过浏览器打开的页面窗口。为了实现特定的功能而定制的，其界面风格和浏览器主窗口不一致。MiniWindow是独立窗口在技术实现时的表 示，Fullview表示页面的某一元素的布局填满当前页面的可视区域，FullviewStyle是能实现Fullview效果的CSS，Browser负责浏览器界面的显示，页面的管理。BrowserView是Browser内的重要子模块，负责用户操作处理，和RenderView通讯，Render渲染结果呈现和新建窗口的显示。Render是渲染器，负责网页的渲染工作，将页面的渲染结果交给Browser来显示。本申请实施例中首先在浏览器中内置能实现Fullview效果的CSS，也就是FullviewStyle，用户在浏览网页时，当Render检测到当前鼠标进入了<video>标签所定义的视频区域，就会通知Browser显示一个提示，提示用户该视频可以通过独立窗口来播放，如果用户根据提示选择通过独立窗口来播放该视频，Browser就会通知Render需要将该视频显示在独立窗口中，Render就将内置的FullviewStyle应用到视频对应的<video>元素上，然后通知Browser新建一个独立窗口并将当前页面显示在新建成的独立窗口中；当用户关闭正在播放视频的独立窗口时，Browser会关闭独立窗口，将页面显示到浏览器的主窗口中，并通知Render恢复页面，Render会视频恢复对应<video>元素的默认CSS样式。
请参阅图3A、图3B和图3C所示，图3A为本申请实施例提供的浏览器中视频元素实现在线视频的浏览器显示示意图，例如QQ浏览器渲染通过HTML5的<video>标签实现的在线视频。图3B为本申请实施例提供的浏览器中检测用户控制鼠标的移动操作示意图，当鼠标进入到视频区域显示的提示如图3B所示。图3C为本申请实施例提供的浏览器在独立窗口中播放视频的播放界面示意图，在独立窗口中播放HTML5中的<video>视频是独立于浏览器的新窗口，是用来显示HTML5视频对应的网页页面的视频内容。
接下来对本申请实施例中详细的方案实现时序过程进行说明。首先对进入独立窗口时序进行说明，主要包括如下步骤：
1、用户移动鼠标；
2、BrowserView根据当前鼠标位置生成鼠标事件MouseMoveEvent，再通过进程间通讯(英文全称：Inter-Process Communication，英文简称：IPC)消息将该鼠标事件传递给RenderView，Browser和Render可以通过IPC互相发送消息通知实现通讯。
3、RenderView接收到BrowserView通过IPC传来的鼠标事件MouseMoveEvent，根据事件中的鼠标位置信息调用网页页面对应的Frame的HandleMouseMoveEvent相关方法；
4、Frame被调用HandleMouseMoveEvent时，先调用自己的HitTest方法找出鼠标事件中的位置所对应的视频元素，如果该元素类型为HTML5<video>视频，就调用RenderView的MouseEnterVideoElement方法，并将该元素做记录，方便后续操作能直接找到该元素，该元素即为时序图中的Video；
5、当RenderView被调用MouseEnterVideoElement时，就向BrowserView发送MouseEnterVideoElementEvent这个IPC消息；
6、BrowserView在收到MouseEnterVideoElementEvent这个IPC消息后就调用自己的ShowMiniWindowTipBar这个方法向用户显示进入MiniWindow的提示消息和操作方法；
7、用户根据提示操作，进入独立窗口显示视频模式；
8、用户操作进入独立窗口显示视频模式后，BrowserView向RenderView发送ShowHTMLVideoInMiniVideoEvent这个IPC消息；
9、RenderView在收到ShowHTMLVideoInMiniVideoEvent这个IPC消息后，就调用Frame的EnterFullview方法；
10、Frame在被调用EnterFullview方法后就调用Video元素的RequestFullview方法；
11、Video在RequestFullview方法被调用后就调用自己的ApplyFullviewStyle方法，该方法中将FullviewStyle应用到Video元素上，然后调用Frame的NeedLayout方法；
12、Frame被调用NeedLayout方法后就调用RenderView的NeedLayout方法；
13、RenderView的NeedLayout方法被调用后就调用自己的Layout方法重新布局整个网页页面，向BrowserView发送EnterMiniVideoModeEvent这个IPC消息；
14、BrowserView在收到EnterMiniVideoModeEvent这个IPC消息后就先调用CreateMiniWindow创建独立视频窗口MiniWindow，然后将当前网页页面从浏览器窗口中移除，然后调用ShowMiniWindow将该网页显示到新创建的独立窗口中。
接下来对退出独立窗口时序进行说明，主要包括如下步骤：
1、用户关闭MiniWindow；
2、MiniWindow调用BrowserView的MiniWindowClosed方法；
3、BrowserView的MiniWindowClosed被调用后就发送ExitMiniVideoModeEvent这个IPC消息给RenderView；
4、RenderView收到ExitMiniVideoModeEvent这个IPC后调用Frame的ExitFullview方法；
5、Frame调用Video的ExitFullview方法；
6、Video移除FullviewStyle这个样式，再应用自己的RestoreOriginalStyle恢复系统默认的样式，然后调用Frame的NeedLayout方法；
7、Frame调用RenderView的NeedLayout方法；
8、RenderView调用自己的Layout方法重新布局整个网页页面。
通过前述对本申请的举例说明可知，本申请实施例中内置FullviewStyle为浏览器添加了一种的新的内置CSS，根据鼠标位置定位特定页面元素，实现了通过鼠标定位页面的<video>标签，在Render中改变页面元素的样式。本申请实施例可以实现对<video>标签应用FullviewStyle和恢复<video>的默认CSS样式，实现在Render中通过鼠标定位页面内的<video>元素，实现Render和Browser之间的消息通知，实现Browser中的提示消息展示和用来可以显示页面的独立窗口。其中，在Render将内置的FullviewStyle应用到<video>元素上，重新布局整个网页页面，使<video>元素填满当前浏览器页面的可视区域，然后通知Browser将该页面显示到独立窗口中。在关闭独立窗口时，将页面显示到原浏览器主窗口中，通知Render恢复<video>的CSS，重新布局。本申请实施例中通过对浏览器的视频元素配置全显示样式以及移除全显示样式，可以为用户提供更好的在线视频观看效果。
需要说明的是，对于前述的各方法实施例，为了简单描述，故将其都表述为一系列的动作组合，但是本领域技术人员应该知悉，本申请并不受所描述的动作顺序的限制，因为依据本申请，某些步骤可以采用其他顺序或者同时进行。其次，本领域技术人员也应该知悉，说明书中所描述的实施例均属于优选实施例，所涉及的动作和模块并不一定是本申请所必须的。
为便于更好的实施本申请实施例的上述方案，下面还提供用于实施上述方案的相关装置。
请参阅图4A所示，本申请实施例提供的一种浏览器在独立窗口中播放视频的装置400，可以包括：操作位置判断模块401、视频元素获取模块402、全显示样式应用模块403、视频播放模块404，其中，
操作位置判断模块401，用于检测浏览器的网页页面中用户指示的操作位置，判断操作位置是否处于网页页面中的视频区域；
视频元素获取模块402，用于若操作位置处于视频区域内，获取在网页页面内的操作位置对应的视频元素；
全显示样式应用模块403，用于将预置的全显示样式应用到视频元素中，并根据应用全显示样式的视频元素将网页页面中当前显示的视频内容填满视频区域；
视频播放模块404，用于创建与网页页面不相同的独立窗口，将视频区域内显示的视频内容转移到独立窗口中进行播放。
在本申请的一些实施例中，请参阅图4B所示，操作位置判断模块401，包括：
事件生成模块4011，用于根据用户在浏览器的网页页面中控制鼠标的移动操作生成鼠标移动事件；
事件检测模块4012，用于在网页页面中检测鼠标移动事件从而生成用户指示的操作位置。
在本申请的一些实施例中，请参阅图4C所示，浏览器在独立窗口中播放视频的装置400还包括：
第一指令检测模块405，用于操作位置判断模块401判断操作位置是否处于网页页面中的视频区域之后，若操作位置处于视频区域内，向用户提示是否创建独立窗口，当获取到用户指示需要创建独立窗口时，触发执行视频元素获取模块402。
在本申请的一些实施例中，请参阅图4D所示，浏览器在独立窗口中播放视频的装置400还包括：
第一重新布局模块406，用于全显示样式应用模块403根据应用全显示样式的视频元素将网页页面中当前显示的视频内容填满视频区域之后，对网页页面进行重新布局，并显示重新布局后的网页页面。
在本申请的一些实施例中，请参阅图4E所示，浏览器在独立窗口中播放视频的装置400还包括：
全显示样式移除模块407，用于视频播放模块404创建与网页页面不相同的独立窗口，将视频区域内显示的视频内容转移到独立窗口中进行播放之后，从视频元素中将全显示样式移除掉，并将默认布局样式应用到视频元素中；
视频恢复模块408，用于将独立窗口中当前播放的视频内容转移到网页页面的视频区域内，然后关闭掉独立窗口；
第二重新布局模块409，用于根据应用默认布局样式的视频元素对网页页面进行重新布局，并显示重新布局后的网页页面。
进一步的，在本申请的一些实施例中，请参阅图4F所示，相对于图4E所示，浏览器在独立窗口中播放视频的装置400还包括：
第二指令检测模块410，用于视频播放模块404创建与网页页面不相同的独立窗口，将视频区域内显示的视频内容转移到独立窗口中进行播放之后，判断是否检测到用户在独立窗口上发送的关闭窗口操作，当检测到关闭窗口操作时，触发执行全显示样式移除模块407。
通过以上对本申请实施例的描述可知，在本申请实施例中视频元素中可以应用全显示样式，从而网页页面中当前显示的视频内容可以填满网页页面的视频区域，视频区域内显示的视频内容可以转移到创建好的独立窗口中继续进行播放，本申请实施例中直接使用网页页面中的视频元素配置全显示样式来完成独立窗口中的视频播放，因此无需在浏览器中安装视频播放插件来播放视频，避免插件经常更新导致的负载操作，视频在独立窗口中的播放都是通过网页页面的自身特性来完成，实现过程简单易操作。
本申请实施例还提供了另一种终端，如图5所示，为了便于说明，仅示出了与本申请实施例相关的部分，具体技术细节未揭示的，请参照本申请实施例方法部分。该终端可以为包括手机、平板电脑、PDA(Personal Digital Assistant，个人数字助理)、POS(Point of Sales，销售终端)、车载电脑等任意终端设备，下面图5以终端为手机为例进行说明。
图5示出的是与本申请实施例提供的终端相关的手机的部分结构的框图。参考图5，手机包括：射频(Radio Frequency，RF)电路1010、存储器1020、输入单元1030、显示单元1040、传感器1050、音频电路1060、无线保真(wireless fidelity，WiFi)模块1070、处理器1080、以及电源1090等部件。本领域技术人员可以理解，图5中示出的手机结构并不构成对手机的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。
下面结合图5对手机的各个构成部件进行具体的介绍：
RF电路1010可用于收发信息或通话过程中，信号的接收和发送，特别地，将基站的下行信息接收后，给处理器1080处理；另外，将设计上行的数据发送 给基站。通常，RF电路1010包括但不限于天线、至少一个放大器、收发信机、耦合器、低噪声放大器(Low Noise Amplifier，LNA)、双工器等。此外，RF电路1010还可以通过无线通信与网络和其他设备通信。上述无线通信可以使用任一通信标准或协议，包括但不限于全球移动通讯系统(Global System of Mobile communication，GSM)、通用分组无线服务(General Packet Radio Service，GPRS)、码分多址(Code Division Multiple Access，CDMA)、宽带码分多址(Wideband Code Division Multiple Access,WCDMA)、长期演进(Long Term Evolution，LTE)、电子邮件、短消息服务(Short Messaging Service，SMS)等。
存储器1020可用于存储软件程序以及模块，处理器1080通过运行存储在存储器1020的软件程序以及模块，从而执行执行本申请所述方法以及终端的各种功能应用以及数据处理。存储器1020可主要包括存储程序区和存储数据区，其中，存储程序区可存储操作系统、至少一个功能所需的应用程序(比如声音播放功能、图像播放功能等)等；存储数据区可存储根据手机的使用所创建的数据(比如音频数据、电话本等)等。此外，存储器1020可以包括高速随机存取存储器，还可以包括非易失性存储器，例如至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。
输入单元1030可用于接收输入的数字或字符信息，以及产生与手机的用户设置以及功能控制有关的键信号输入。具体地，输入单元1030可包括触控面板1031以及其他输入设备1032。触控面板1031，也称为触摸屏，可收集用户在其上或附近的触摸操作(比如用户使用手指、触笔等任何适合的物体或附件在触控面板1031上或在触控面板1031附近的操作)，并根据预先设定的程式驱动相应的连接装置。可选的，触控面板1031可包括触摸检测装置和触摸控制器两个部分。其中，触摸检测装置检测用户的触摸方位，并检测触摸操作带来的信号，将信号传送给触摸控制器；触摸控制器从触摸检测装置上接收触摸信息，并将它转换成触点坐标，再送给处理器1080，并能接收处理器1080发来的命令并加以执行。此外，可以采用电阻式、电容式、红外线以及表面声波等多种类型实现触控面板1031。除了触控面板1031，输入单元1030还可以包括其他输入设备1032。具体地，其他输入设备1032可以包括但不限于物理键盘、功能键(比如音量控制按键、开关按键等)、轨迹球、鼠标、操作杆等中的一种或多种。
显示单元1040可用于显示由用户输入的信息或提供给用户的信息以及手机的各种菜单。显示单元1040可包括显示面板1041，可选的，可以采用液晶显示 器(Liquid Crystal Display，LCD)、有机发光二极管(Organic Light-Emitting Diode,OLED)等形式来配置显示面板1041。进一步的，触控面板1031可覆盖显示面板1041，当触控面板1031检测到在其上或附近的触摸操作后，传送给处理器1080以确定触摸事件的类型，随后处理器1080根据触摸事件的类型在显示面板1041上提供相应的视觉输出。虽然在图5中，触控面板1031与显示面板1041是作为两个独立的部件来实现手机的输入和输入功能，但是在某些实施例中，可以将触控面板1031与显示面板1041集成而实现手机的输入和输出功能。
手机还可包括至少一种传感器1050，比如光传感器、运动传感器以及其他传感器。具体地，光传感器可包括环境光传感器及接近传感器，其中，环境光传感器可根据环境光线的明暗来调节显示面板1041的亮度，接近传感器可在手机移动到耳边时，关闭显示面板1041和/或背光。作为运动传感器的一种，加速计传感器可检测各个方向上(一般为三轴)加速度的大小，静止时可检测出重力的大小及方向，可用于识别手机姿态的应用(比如横竖屏切换、相关游戏、磁力计姿态校准)、振动识别相关功能(比如计步器、敲击)等；至于手机还可配置的陀螺仪、气压计、湿度计、温度计、红外线传感器等其他传感器，在此不再赘述。
音频电路1060、扬声器1061，传声器1062可提供用户与手机之间的音频接口。音频电路1060可将接收到的音频数据转换后的电信号，传输到扬声器1061，由扬声器1061转换为声音信号输出；另一方面，传声器1062将收集的声音信号转换为电信号，由音频电路1060接收后转换为音频数据，再将音频数据输出处理器1080处理后，经RF电路1010以发送给比如另一手机，或者将音频数据输出至存储器1020以便进一步处理。
WiFi属于短距离无线传输技术，手机通过WiFi模块1070可以帮助用户收发电子邮件、浏览网页和访问流式媒体等，它为用户提供了无线的宽带互联网访问。虽然图5示出了WiFi模块1070，但是可以理解的是，其并不属于手机的必须构成，完全可以根据需要在不改变发明的本质的范围内而省略。
处理器1080是手机的控制中心，利用各种接口和线路连接整个手机的各个部分，通过运行或执行存储在存储器1020内的软件程序和/或模块，以及调用存储在存储器1020内的数据，执行手机的各种功能和处理数据，从而对手机进行整体监控。可选的，处理器1080可包括一个或多个处理单元；优选的，处理器1080可集成应用处理器和调制解调处理器，其中，应用处理器主要处理操作系 统、用户界面和应用程序等，调制解调处理器主要处理无线通信。可以理解的是，上述调制解调处理器也可以不集成到处理器1080中。
手机还包括给各个部件供电的电源1090(比如电池)，优选的，电源可以通过电源管理系统与处理器1080逻辑相连，从而通过电源管理系统实现管理充电、放电、以及功耗管理等功能。
尽管未示出，手机还可以包括摄像头、蓝牙模块等，在此不再赘述。
在本申请实施例中，该终端所包括的处理器1080还具有控制执行以上由终端执行的方法流程。
另外需说明的是，以上所描述的装置实施例仅仅是示意性的，其中所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。另外，本申请提供的装置实施例附图中，模块之间的连接关系表示它们之间具有通信连接，具体可以实现为一条或多条通信总线或信号线。本领域普通技术人员在不付出创造性劳动的情况下，即可以理解并实施。
通过以上的实施方式的描述，所属领域的技术人员可以清楚地了解到本申请可借助软件加必需的通用硬件的方式来实现，当然也可以通过专用硬件包括专用集成电路、专用CPU、专用存储器、专用元器件等来实现。一般情况下，凡由计算机程序完成的功能都可以很容易地用相应的硬件来实现，而且，用来实现同一功能的具体硬件结构也可以是多种多样的，例如模拟电路、数字电路或专用电路等。但是，对本申请而言更多情况下软件程序实现是更佳的实施方式。
基于这样的理解，本申请提供了一种计算机可读存储介质，在所述计算机可读存储介质上存储有用于执行上述方法的程序指令。本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在可读取的存储介质中，如计算机的软盘，U盘、移动硬盘、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本申请各个实施例所述的方法。
综上所述，以上实施例仅用以说明本申请的技术方案，而非对其限制；尽管参照上述实施例对本申请进行了详细的说明，本领域的普通技术人员应当理 解：其依然可以对上述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本申请各实施例技术方案的精神和范围。

Claims (15)

  1. 一种浏览器在独立窗口中播放视频的方法，所述方法由设置在终端中的处理器执行，其特征在于，包括：
    检测浏览器的网页页面中用户指示的操作位置，判断所述操作位置是否处于所述网页页面中的视频区域；
    若所述操作位置处于所述视频区域内，获取在所述网页页面内的所述操作位置对应的视频元素；
    将预置的全显示样式应用到所述视频元素中，从而将所述网页页面中当前显示的视频内容填满所述视频区域；
    创建与所述网页页面不相同的独立窗口，并将所述视频区域内显示的视频内容转移到所述独立窗口中进行播放。
  2. 根据权利要求1所述的方法，其特征在于，所述检测浏览器的网页页面中用户指示的操作位置，包括：
    根据用户在浏览器的网页页面中控制鼠标的移动操作生成鼠标移动事件；
    在所述网页页面中检测所述鼠标移动事件从而生成用户指示的操作位置。
  3. 根据权利要求1所述的方法，其特征在于，所述判断所述操作位置是否处于所述网页页面中的视频区域之后，所述方法还包括：
    若所述操作位置处于所述视频区域内，向所述用户提示是否创建独立窗口，当获取到所述用户指示需要创建独立窗口时，触发如下步骤执行：获取在所述网页页面内的所述操作位置对应的视频元素。
  4. 根据权利要求1所述的方法，其特征在于，在将所述网页页面中当前显示的视频内容填满所述视频区域之后，所述方法还包括:
    对所述网页页面进行重新布局，并显示重新布局后的网页页面。
  5. 根据权利要求1所述的方法，其特征在于，在将所述视频区域内显示的视频内容转移到所述独立窗口中进行播放之后，所述方法还包括：
    从所述视频元素中将所述全显示样式移除掉，并将默认布局样式应用到所述视频元素中；
    将所述独立窗口中当前播放的视频内容转移到所述网页页面的视频区域内，然后关闭掉所述独立窗口；
    根据应用所述默认布局样式的视频元素，对所述网页页面进行重新布局， 并显示重新布局后的网页页面。
  6. 根据权利要求5所述的方法，其特征在于，在将所述视频区域内显示的视频内容转移到所述独立窗口中进行播放之后，所述方法还包括：
    判断是否检测到用户在所述独立窗口上发送的关闭窗口操作，当检测到所述关闭窗口操作时，触发执行如下步骤：从所述视频元素中将所述全显示样式移除掉，并将默认布局样式应用到所述视频元素中。
  7. 根据权利要求1所述的方法，其特征在于，所述全显示样式是实现页面填满效果的层叠样式表。
  8. 一种浏览器在独立窗口中播放视频的装置，其特征在于，包括一个或多个处理器和存储有操作指令的存储介质，当运行所述存储介质中的操作指令时，所述处理器执行如下步骤：
    检测浏览器的网页页面中用户指示的操作位置，判断所述操作位置是否处于所述网页页面中的视频区域；
    若所述操作位置处于所述视频区域内，获取在所述网页页面内的所述操作位置对应的视频元素；
    将预置的全显示样式应用到所述视频元素中，从而将所述网页页面中当前显示的视频内容填满所述视频区域；
    创建与所述网页页面不相同的独立窗口，并将所述视频区域内显示的视频内容转移到所述独立窗口中进行播放。
  9. 根据权利要求8所述的装置，其特征在于，所述处理器还用于：
    根据用户在浏览器的网页页面中控制鼠标的移动操作生成鼠标移动事件；
    在所述网页页面中检测所述鼠标移动事件从而生成用户指示的操作位置。
  10. 根据权利要求8所述的装置，其特征在于，所述处理器还用于：
    若所述操作位置处于所述视频区域内，向所述用户提示是否创建独立窗口，当获取到所述用户指示需要创建独立窗口时，触发如下步骤执行：获取在所述网页页面内的所述操作位置对应的视频元素。
  11. 根据权利要求8所述的装置，其特征在于，所述处理器还用于：
    在将所述网页页面中当前显示的视频内容填满所述视频区域之后，对所述网页页面进行重新布局，并显示重新布局后的网页页面。
  12. 根据权利要求8所述的装置，其特征在于，所述处理器还用于：
    在将所述视频区域内显示的视频内容转移到所述独立窗口中进行播放之 后，从所述视频元素中将所述全显示样式移除掉，并将默认布局样式应用到所述视频元素中；
    将所述独立窗口中当前播放的视频内容转移到所述网页页面的视频区域内，然后关闭掉所述独立窗口；
    根据应用所述默认布局样式的视频元素，对所述网页页面进行重新布局，并显示重新布局后的网页页面。
  13. 根据权利要求12所述的装置，其特征在于，所述处理器还用于：
    在将所述视频区域内显示的视频内容转移到所述独立窗口中进行播放之后，判断是否检测到用户在所述独立窗口上发送的关闭窗口操作，当检测到所述关闭窗口操作时，触发执行如下步骤：从所述视频元素中将所述全显示样式移除掉，并将默认布局样式应用到所述视频元素中。
  14. 根据权利要求8所述的装置，其特征在于，所述全显示样式是实现页面填满效果的层叠样式表。
  15. 一种计算机可读存储介质，在所述计算机可读存储介质上存储有用于执行如权利要求1-7中的任一项所述的方法的程序指令。
PCT/CN2017/098840 2016-08-26 2017-08-24 浏览器在独立窗口中播放视频的方法、装置及存储介质 WO2018036544A1 (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
US16/201,840 US10839137B2 (en) 2016-08-26 2018-11-27 Method and apparatus for playing video in independent window by browser, and storage medium

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201610740979.5 2016-08-26
CN201610740979.5A CN107786906B (zh) 2016-08-26 2016-08-26 一种浏览器在独立窗口中播放视频的方法和装置

Related Child Applications (1)

Application Number Title Priority Date Filing Date
US16/201,840 Continuation US10839137B2 (en) 2016-08-26 2018-11-27 Method and apparatus for playing video in independent window by browser, and storage medium

Publications (1)

Publication Number Publication Date
WO2018036544A1 true WO2018036544A1 (zh) 2018-03-01

Family

ID=61245486

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2017/098840 WO2018036544A1 (zh) 2016-08-26 2017-08-24 浏览器在独立窗口中播放视频的方法、装置及存储介质

Country Status (3)

Country Link
US (1) US10839137B2 (zh)
CN (1) CN107786906B (zh)
WO (1) WO2018036544A1 (zh)

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111417027A (zh) * 2020-03-23 2020-07-14 青岛海信传媒网络技术有限公司 网页视频全屏播放切换小窗口播放的方法及显示设备
CN115175002A (zh) * 2022-06-28 2022-10-11 青岛海信移动通信技术股份有限公司 一种视频播放方法及设备
CN115243092A (zh) * 2022-07-01 2022-10-25 网易（杭州）网络有限公司 视频播放方法、装置及存储介质

Families Citing this family (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110300320B (zh) * 2018-03-22 2022-01-21 杭州海康威视数字技术股份有限公司 一种视频播放方法、装置、电子设备及存储介质
CN109640153B (zh) * 2018-12-12 2021-07-20 安徽科大国创软件科技有限公司 一种基于vlc的浏览器多窗口播放的方法及其装置
CN110650352B (zh) * 2019-09-06 2020-12-08 四川天邑康和通信股份有限公司 一种iptv浏览器的视频处理方法
CN111078785B (zh) * 2019-11-27 2023-12-01 贝壳技术有限公司 一种数据可视化展示的方法、装置、电子设备及存储介质
US11756528B2 (en) * 2020-04-13 2023-09-12 Videate, Inc. Automatic generation of videos for digital products using instructions of a markup document on web based documents
CN111935510B (zh) * 2020-08-18 2022-06-07 海信视像科技股份有限公司 一种双浏览器应用加载方法及显示设备
CN112199019A (zh) * 2020-10-16 2021-01-08 深圳传音控股股份有限公司 一种交互方法、终端及计算机可读存储介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101504648A (zh) * 2008-11-14 2009-08-12 北京搜狗科技发展有限公司 展现网页资源的方法及装置
CN101515288A (zh) * 2009-03-11 2009-08-26 腾讯科技（深圳）有限公司 多页面浏览器中的网络视频的播放方法及处理装置
CN101587489A (zh) * 2009-06-12 2009-11-25 北京搜狗科技发展有限公司 一种浏览器展现页面特定资源的方法及系统
CN103338384A (zh) * 2013-05-31 2013-10-02 优视科技有限公司 一种视频播放方法及装置

Family Cites Families (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US7788583B1 (en) * 2004-03-04 2010-08-31 Google Inc. In-page full screen internet video method
US9569097B2 (en) * 2011-12-01 2017-02-14 Microsoft Technology Licesing, LLC Video streaming in a web browser
CN103577176A (zh) * 2012-08-02 2014-02-12 腾讯科技（深圳）有限公司 视频独立播放的实现方法及实现该方法的移动终端设备
US9648062B2 (en) * 2014-06-12 2017-05-09 Apple Inc. Systems and methods for multitasking on an electronic device with a touch-sensitive display

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101504648A (zh) * 2008-11-14 2009-08-12 北京搜狗科技发展有限公司 展现网页资源的方法及装置
CN101515288A (zh) * 2009-03-11 2009-08-26 腾讯科技（深圳）有限公司 多页面浏览器中的网络视频的播放方法及处理装置
CN101587489A (zh) * 2009-06-12 2009-11-25 北京搜狗科技发展有限公司 一种浏览器展现页面特定资源的方法及系统
CN103338384A (zh) * 2013-05-31 2013-10-02 优视科技有限公司 一种视频播放方法及装置

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111417027A (zh) * 2020-03-23 2020-07-14 青岛海信传媒网络技术有限公司 网页视频全屏播放切换小窗口播放的方法及显示设备
CN115175002A (zh) * 2022-06-28 2022-10-11 青岛海信移动通信技术股份有限公司 一种视频播放方法及设备
CN115175002B (zh) * 2022-06-28 2023-11-03 青岛海信移动通信技术有限公司 一种视频播放方法及设备
CN115243092A (zh) * 2022-07-01 2022-10-25 网易（杭州）网络有限公司 视频播放方法、装置及存储介质
CN115243092B (zh) * 2022-07-01 2024-02-23 网易（杭州）网络有限公司 视频播放方法、装置及存储介质

Also Published As

Publication number Publication date
US20190129923A1 (en) 2019-05-02
US10839137B2 (en) 2020-11-17
CN107786906A (zh) 2018-03-09
CN107786906B (zh) 2021-05-25

Similar Documents

Publication Publication Date Title
WO2018036544A1 (zh) 浏览器在独立窗口中播放视频的方法、装置及存储介质
WO2022156368A1 (zh) 推荐信息展示方法及装置
WO2018161811A1 (zh) 一种基于h5的页面显示方法和终端
KR102108583B1 (ko) 인스턴스화가능한 제스처 객체
WO2017008551A1 (zh) 弹幕显示方法及装置
KR101640460B1 (ko) 휴대 단말기의 분할 화면 운용 방법 및 이를 지원하는 휴대 단말기
CN104995601B (zh) 切换到本机网页应用程序及从本机网页应用程序切换离开
WO2018040943A1 (zh) 显示数据的控制方法、装置和系统
WO2018157812A1 (zh) 一种实现视频分支选择播放的方法及装置
KR20140144104A (ko) 전자기기 및 이의 서비스 제공 방법
KR20160141838A (ko) 확장가능한 애플리케이션 표시
US10506292B2 (en) Video player calling method, apparatus, and storage medium
CN106610826B (zh) 在线场景应用的制作方法及装置
US11455075B2 (en) Display method when application is exited and terminal
EP4124052A1 (en) Video production method and apparatus, and device and storage medium
TWI646835B (zh) 一種電視節目播放方法以及相關的終端設備
EP2963935A1 (en) Multi screen display controlled by a plurality of remote controls
WO2019201140A1 (zh) 应用显示方法、装置、存储介质及电子设备
CN113613064B (zh) 视频处理方法、装置、存储介质及终端
US10713414B2 (en) Web page display method, terminal, and storage medium
US20200301992A1 (en) Page updating method and display device
KR20140086979A (ko) 인터넷 브라우저-기반 원격 사용자 인터페이스 가상 마우스 커서 위치결정 방법
US11243679B2 (en) Remote data input framework
US9256358B2 (en) Multiple panel touch user interface navigation
WO2015014138A1 (zh) 一种显示框显示的方法、装置和设备

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 17842966

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 17842966

Country of ref document: EP

Kind code of ref document: A1