一種網(wǎng)頁(yè)中視頻元素的播放方法和裝置制造方法
【專利摘要】本發(fā)明公開了一種網(wǎng)頁(yè)中視頻元素的播放方法和裝置，涉及瀏覽器【技術(shù)領(lǐng)域】。所述方法包括：從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示；通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。本發(fā)明可以在網(wǎng)頁(yè)文檔中視頻元素的初始位置移出顯示視窗之后，使視頻元素出現(xiàn)在顯示視窗中展示，在用戶瀏覽器網(wǎng)頁(yè)中其他信息(比如視頻評(píng)論、推薦視頻等)時(shí)可以同時(shí)觀看視頻元素中的播放內(nèi)容。
【專利說明】一種網(wǎng)頁(yè)中視頻元素的播放方法和裝置
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及瀏覽器【技術(shù)領(lǐng)域】，具體涉及一種網(wǎng)頁(yè)中視頻元素的播放方法和裝置。
【背景技術(shù)】
[0002]瀏覽器是指可以顯示網(wǎng)頁(yè)服務(wù)器或者文件系統(tǒng)的HTML(超文本標(biāo)記語(yǔ)言，HyperText Mark-up Language))文件內(nèi)容,并讓用戶與這些文件交互的一種軟件。網(wǎng)頁(yè)瀏覽器主要通過HTTP協(xié)議與網(wǎng)頁(yè)服務(wù)器交互并獲取網(wǎng)頁(yè)，這些網(wǎng)頁(yè)由URL(統(tǒng)一資源定位符，Uniform Resource Locator)指定，文件格式通常為HTML。一個(gè)網(wǎng)頁(yè)中可以包括多個(gè)文檔，每個(gè)文檔都是分別從服務(wù)器獲取的。HTTP內(nèi)容類型和URL協(xié)議規(guī)范允許網(wǎng)頁(yè)設(shè)計(jì)者在網(wǎng)頁(yè)中嵌入圖像、視頻等。
[0003]而當(dāng)前的網(wǎng)頁(yè)服務(wù)器中存在一種帶有視頻內(nèi)容的網(wǎng)頁(yè)，其視頻內(nèi)容一般是在頁(yè)面的某個(gè)位置進(jìn)行播放，然后視頻下方很長(zhǎng)的一部分是其他內(nèi)容，比如相關(guān)廣告圖片，相關(guān)推薦視頻的鏈接，當(dāng)前視頻評(píng)論等內(nèi)容，其頁(yè)面整體高度遠(yuǎn)遠(yuǎn)大于瀏覽器顯示視窗的高度。那么，當(dāng)用戶通過鼠標(biāo)滾輪或者滾動(dòng)條滑動(dòng)頁(yè)面去瀏覽其他位置的信息(比如視頻評(píng)論)時(shí)，頁(yè)面中播放的視頻可能移出顯示視窗，以至用戶則無法觀看到視頻內(nèi)容。
【發(fā)明內(nèi)容】
[0004]鑒于上述問題，提出了本發(fā)明以便提供一種克服上述問題或者至少部分地解決上述問題的網(wǎng)頁(yè)中視頻元素的播放裝置和相應(yīng)的網(wǎng)頁(yè)中視頻元素的播放方法。
[0005]依據(jù)本發(fā)明的一個(gè)方面，提供了一種網(wǎng)頁(yè)中視頻元素的播放方法，包括:從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0006]判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0007]所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示；
[0008]通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。
[0009]根據(jù)本發(fā)明的另一方面，提供了一種網(wǎng)頁(yè)中視頻元素的播放裝置，包括:
[0010]網(wǎng)頁(yè)文檔獲取模塊，適于從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0011]腳本加載模塊，適于判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0012]顯示位置判斷模塊，適于所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示；
[0013]顯示位置更改模塊，適于通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。
[0014]根據(jù)本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放方法和裝置，可以對(duì)瀏覽器加載的特定網(wǎng)頁(yè)，注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本，該顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示后，通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示，由此解決了用戶滑動(dòng)頁(yè)面時(shí)，當(dāng)視頻元素移出顯示視窗之后，用戶瀏覽網(wǎng)頁(yè)中的信息時(shí)無法同時(shí)觀看視頻元素中的播放內(nèi)容的問題，取得了可以在網(wǎng)頁(yè)文檔中視頻元素的初始位置移出顯示視窗之后，使視頻元素出現(xiàn)在顯示視窗中展示，在用戶瀏覽器網(wǎng)頁(yè)中其他信息(比如視頻評(píng)論、推薦視頻等)時(shí)可以同時(shí)觀看視頻元素中的播放內(nèi)容的有益效果。
[0015]上述說明僅是本發(fā)明技術(shù)方案的概述，為了能夠更清楚了解本發(fā)明的技術(shù)手段，而可依照說明書的內(nèi)容予以實(shí)施，并且為了讓本發(fā)明的上述和其它目的、特征和優(yōu)點(diǎn)能夠更明顯易懂，以下特舉本發(fā)明的【具體實(shí)施方式】。
【專利附圖】
【附圖說明】
[0016]通過閱讀下文優(yōu)選實(shí)施方式的詳細(xì)描述，各種其他的優(yōu)點(diǎn)和益處對(duì)于本領(lǐng)域普通技術(shù)人員將變得清楚明了。附圖僅用于示出優(yōu)選實(shí)施方式的目的，而并不認(rèn)為是對(duì)本發(fā)明的限制。而且在整個(gè)附圖中，用相同的參考符號(hào)表示相同的部件。在附圖中:
[0017]圖1示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放方法的流程示意圖；
[0018]圖2示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放方法的流程示意圖；
[0019]圖3示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放方法的流程示意圖；
[0020]圖3A示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種的視頻元素初始的加載狀態(tài)示意圖；
[0021]圖3B示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種視頻元素部分未顯示時(shí)觸發(fā)小窗口播放視頻元素的示意圖；
[0022]圖4示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放方法的流程示意圖；
[0023]圖4A示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的在圖3A的基礎(chǔ)上的一種視頻元素頂部開始進(jìn)入部分顯示狀態(tài)時(shí)觸發(fā)小窗口播放視頻元素的示意圖；
[0024]圖5示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放方法的流程示意圖；
[0025]圖5A示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的在圖3A的基礎(chǔ)上的一種視頻元素頂部開始進(jìn)入全部未顯示狀態(tài)時(shí)觸發(fā)小窗口播放視頻元素的示意圖；
[0026]圖6示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放裝置的結(jié)構(gòu)示意圖；
[0027]圖7示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放裝置的結(jié)構(gòu)示意圖；
[0028]圖8示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放裝置的結(jié)構(gòu)示意圖；
[0029]圖9示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放裝置的結(jié)構(gòu)示意圖；
[0030]圖10示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種網(wǎng)頁(yè)中視頻元素的播放裝置的結(jié)構(gòu)示意圖。
【具體實(shí)施方式】
[0031]本發(fā)明的核心思想之一是:對(duì)可以對(duì)瀏覽器加載的特定網(wǎng)頁(yè)，注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；那么在瀏覽器加載上述網(wǎng)頁(yè)文檔時(shí)加載所述顯示控制，該顯示控制腳本判斷網(wǎng)頁(yè)中的視頻元素是否在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示，如果在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示，通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。以使網(wǎng)頁(yè)中的視頻元素能以網(wǎng)頁(yè)的視頻元素的身份在顯示視窗中一直播放，使用戶在滾動(dòng)網(wǎng)頁(yè)以瀏覽非視頻元素的信息時(shí)，也可以方便的看到視頻元素的播放內(nèi)容。
[0032]實(shí)施例一
[0033]參照?qǐng)D1，其示出了本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放方法，具體可以包括:
[0034]步驟110，從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0035]在實(shí)際應(yīng)用中，本發(fā)明實(shí)施例的瀏覽器在接收用戶輸入的URL(統(tǒng)一資源定位符，Uniform Resource Locator)后，可發(fā)送相應(yīng)的HTTP(超文本轉(zhuǎn)移協(xié)議，HypertextTransfer Protocol)請(qǐng)求從網(wǎng)頁(yè)服務(wù)器獲取HTML(即超文本標(biāo)記語(yǔ)言,HyperText Mark-upLanguage)文檔,該HTML用于加載到瀏覽器的tab標(biāo)簽頁(yè)中展示。
[0036]步驟120，判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0037]在本發(fā)明實(shí)施例中，對(duì)于瀏覽器獲取的網(wǎng)頁(yè)文檔，首先會(huì)針對(duì)URL和或者網(wǎng)頁(yè)內(nèi)容，判斷該網(wǎng)頁(yè)文檔是否為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。所述可播放的視頻元素比如用于播放電視劇、電影等內(nèi)容的視頻元素。當(dāng)判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本。該顯示控制腳本執(zhí)行后具有控制瀏覽器進(jìn)行后續(xù)執(zhí)行過程的邏輯，即對(duì)所述視頻元素進(jìn)行顯示控制。
[0038]優(yōu)選地，所述判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)包括:
[0039]子步驟A121，針對(duì)當(dāng)前網(wǎng)頁(yè)文檔對(duì)應(yīng)的網(wǎng)址，根據(jù)以通配符構(gòu)建的網(wǎng)址匹配規(guī)則和/或預(yù)置的網(wǎng)址名單，對(duì)所述網(wǎng)址進(jìn)行匹配；當(dāng)網(wǎng)址匹配上，則判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。
[0040]在本發(fā)明實(shí)施例中，對(duì)于瀏覽器獲取的網(wǎng)頁(yè)文檔的URL，本發(fā)明可以通配符構(gòu)建網(wǎng)址匹配規(guī)則，比如對(duì)于通配符*，構(gòu)建網(wǎng)址匹配規(guī)則:*v.youku*,則表示帶有V.youku的任意網(wǎng)址均為特定網(wǎng)頁(yè)。那么如果所述URL包括V.youku則意味著匹配上。
[0041 ] 或者預(yù)置網(wǎng)址名單，比如對(duì)youku視頻網(wǎng)站、360視頻網(wǎng)站等主流視頻網(wǎng)站的播放頁(yè)面構(gòu)建網(wǎng)址名單，將所述URL與網(wǎng)址名單進(jìn)行匹配。
[0042]上述兩種匹配方式可以單獨(dú)使用，也可以同時(shí)使用。
[0043]優(yōu)選地，在網(wǎng)址匹配上之后，包括:
[0044]子步驟A122，提取對(duì)應(yīng)所述網(wǎng)址的網(wǎng)頁(yè)架構(gòu)模板，并利用所述網(wǎng)頁(yè)架構(gòu)模板對(duì)所述網(wǎng)頁(yè)文檔進(jìn)行匹配；當(dāng)所述網(wǎng)頁(yè)文檔與上述網(wǎng)頁(yè)架構(gòu)模板匹配上，則判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。
[0045]在前述對(duì)網(wǎng)址匹配后，如果匹配上網(wǎng)址，則可先進(jìn)入本步驟，提取對(duì)應(yīng)所述匹配上的網(wǎng)址的網(wǎng)頁(yè)架構(gòu)模塊，利用所述網(wǎng)頁(yè)架構(gòu)模板對(duì)所述網(wǎng)頁(yè)文檔進(jìn)行匹配。
[0046]在實(shí)際中，網(wǎng)頁(yè)文檔可解析為DOM樹結(jié)構(gòu)，而每個(gè)網(wǎng)站的設(shè)計(jì)的各欄目的網(wǎng)頁(yè)的DOM樹結(jié)構(gòu)不盡相同，那么本發(fā)明可基于每個(gè)網(wǎng)站各欄目的網(wǎng)頁(yè)文檔的DOM樹，構(gòu)建網(wǎng)頁(yè)架構(gòu)模板，該模板可以精準(zhǔn)定位該類型網(wǎng)頁(yè)文檔中可播放視頻元素的位置。
[0047]如此，如果所述網(wǎng)頁(yè)文檔與上述網(wǎng)頁(yè)架構(gòu)模板匹配上，則判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。
[0048]步驟130，所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示；
[0049]在實(shí)際應(yīng)用中，所述顯示控制腳本加載之后，會(huì)監(jiān)控瀏覽器上的onsroll事件(滾動(dòng)事件)，該滾動(dòng)事件可以由鼠標(biāo)滾輪觸發(fā)，也可以通過拖動(dòng)滾動(dòng)條的方式觸發(fā)。該滾動(dòng)事件的觸發(fā)，意味著用戶在拖動(dòng)網(wǎng)頁(yè)上下移動(dòng)。
[0050]在用戶拖動(dòng)網(wǎng)頁(yè)以移動(dòng)時(shí)，由顯示控制腳本加載的邏輯模塊，判斷在網(wǎng)頁(yè)中展示的視頻元素是否在當(dāng)前瀏覽器顯示窗中部分的顯示或者全部的未被顯示。如果判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示則進(jìn)入步驟140。
[0051]步驟140，通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。
[0052]在本發(fā)明實(shí)施例中，在注入腳本后的網(wǎng)頁(yè)文檔加載完成后，在網(wǎng)頁(yè)初始位置進(jìn)行顯示的視頻元素，可以通過所述顯示控制腳本的控制邏輯，將該初始位置的視頻元素在當(dāng)前顯示視窗的網(wǎng)頁(yè)中獨(dú)立顯示。
[0053]所述獨(dú)立顯示可以理解為，將視頻元素的顯示位置從初始位置剝離，使其可以在當(dāng)前瀏覽器的顯示視窗中展示的網(wǎng)頁(yè)中的某個(gè)位置進(jìn)行顯示。當(dāng)然，從整體層面上，可以理解為將視頻元素的視頻內(nèi)容一直保留在瀏覽器顯示視窗中進(jìn)行播放，不用隨著用戶對(duì)網(wǎng)頁(yè)的操作而隱藏、或者顯示不全。
[0054]當(dāng)然本發(fā)明中，所述獨(dú)立顯示，一般是將視頻元素的播放界面整體縮小后，在瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行展示，避免由于視頻元素初始的播放區(qū)域太大，在其進(jìn)行獨(dú)立顯示時(shí)，遮蔽用戶對(duì)網(wǎng)頁(yè)其他信息(比如視頻評(píng)論)的瀏覽。
[0055]優(yōu)選地，所述通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示包括:
[0056]子步驟A141，元素位置更改模塊，適于所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯
/Jn ο
[0057]在判斷出網(wǎng)頁(yè)中的視頻元素在在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示后，則可以修改所述視頻元素在網(wǎng)頁(yè)中顯示的位置，并修改視頻元素的顯示層索引(比如z-1ndex屬性)，使視頻元素可一直在頁(yè)面視窗中展示的網(wǎng)頁(yè)中播放。
[0058]優(yōu)選地，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0059]子步驟A162，獲取當(dāng)前視頻元素中播放的視頻的關(guān)聯(lián)視頻信息；當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，在視頻元素顯示供所述關(guān)聯(lián)視頻信息并提供點(diǎn)擊接口。
[0060]即將當(dāng)如視頻兀素關(guān)聯(lián)的視頻彳目息，比如基于關(guān)聯(lián)視頻的網(wǎng)址、名稱構(gòu)建點(diǎn)擊接口并展示給用戶。
[0061]優(yōu)選地，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0062]子步驟A163，當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，加載并展示針對(duì)當(dāng)前視頻內(nèi)容的功能接口 ；所述功能接口包括下載接口、和/或分享接口、和/或收藏接口、和/或調(diào)用第三方視頻播放軟件播放所述視頻內(nèi)容接口中至少一個(gè)。
[0063]本發(fā)明可提供多個(gè)實(shí)用的功能，打通與其他軟件(比如調(diào)用第三方視頻播放軟件播放所述視頻內(nèi)容接口)、組件(比如下載接口、收藏接口)、網(wǎng)站的接口(比如分享接口，如分享給新浪微博)，給用戶提供更豐富的體驗(yàn)。
[0064]優(yōu)選地，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0065]子步驟A164，當(dāng)偵聽到針對(duì)視頻元素顯示位置的尺寸變更操作時(shí)，根據(jù)拖拽動(dòng)作修改視頻元素CSS文件中的顯示尺寸。
[0066]本發(fā)明的獨(dú)立顯示的視頻元素可根據(jù)用戶對(duì)視頻元素的顯示框的拖拽改變顯示尺寸。
[0067]優(yōu)選地，在所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示之前，還包括:
[0068]子步驟A165，判斷當(dāng)前網(wǎng)頁(yè)中是否存在多個(gè)視頻元素；如果存在，則提示用戶選擇進(jìn)行小窗顯示的視頻元素并提供選擇接口 ；對(duì)于用戶未選擇的視頻元素，停止判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示。
[0069]當(dāng)一個(gè)網(wǎng)頁(yè)中存在多個(gè)視頻時(shí)，本發(fā)明可提供給用戶選擇項(xiàng)，使其可以選擇對(duì)哪些視頻元素進(jìn)行獨(dú)立播放，哪些不用獨(dú)立播放。
[0070]優(yōu)選地，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0071]子步驟A166，當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，觸發(fā)對(duì)所述視頻元素中播放內(nèi)容的暫停操作；當(dāng)鼠標(biāo)移出所述視頻元素顯示位置后，再繼續(xù)播放所述視頻內(nèi)容。
[0072]本發(fā)明實(shí)施例可通過鼠標(biāo)的懸停與否控制視頻的播放/暫停，方便用戶操作。
[0073]優(yōu)選地，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0074]子步驟A167，當(dāng)在所述視頻元素的顯示位置偵聽到拖拽動(dòng)作后，將所述視頻元素的顯示位置的位置隨著拖拽動(dòng)作移動(dòng)。
[0075]本發(fā)明實(shí)施例獨(dú)立顯示的視頻元素還可根據(jù)用戶的拖拽移動(dòng)顯示區(qū)域，方便用戶操作。
[0076]優(yōu)選地，所述通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0077]子步驟A168，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；適于如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0078]在本發(fā)明實(shí)施例中，為了提高用戶體驗(yàn)，當(dāng)用戶向上滾動(dòng)網(wǎng)頁(yè)時(shí)，如果滾動(dòng)到視頻元素初始出現(xiàn)的顯示位置，那么進(jìn)行小窗播放的視頻元素則回到其初始的顯示位置，其小窗播放模式則取消。
[0079]根據(jù)本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放方法和裝置，可以通過瀏覽器對(duì)其獲取的網(wǎng)頁(yè)文檔加入顯示控制腳本，該顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示后，通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示，由此解決了用戶滑動(dòng)頁(yè)面時(shí)，當(dāng)視頻元素移出顯示視窗之后，用戶瀏覽網(wǎng)頁(yè)中的信息時(shí)無法同時(shí)觀看視頻元素中的播放內(nèi)容的問題，時(shí)取得了可以在網(wǎng)頁(yè)文檔中視頻元素的初始位置移出顯示視窗之后，使視頻元素出現(xiàn)在顯示視窗中展示，在用戶瀏覽器網(wǎng)頁(yè)中其他信息(比如視頻評(píng)論、推薦視頻等)時(shí)可以同時(shí)觀看視頻元素中的播放內(nèi)容的有益效果。
[0080]實(shí)施例二
[0081]參照?qǐng)D2，其示出了本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放方法，具體可以包括:
[0082]步驟210，從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0083]步驟220，判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0084]步驟230，所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示；
[0085]在用戶拖動(dòng)網(wǎng)頁(yè)以移動(dòng)時(shí)，由顯示控制腳本加載的邏輯模塊，判斷在網(wǎng)頁(yè)中展示的視頻元素是否在當(dāng)前瀏覽器顯示窗中部分的顯示或者全部的未被顯示。如果判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示則進(jìn)入步驟240。
[0086]優(yōu)選地，所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示，包括:
[0087]子步驟S232，根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示。
[0088]在實(shí)際應(yīng)用中，瀏覽器對(duì)頁(yè)面進(jìn)行展示時(shí)至少有4個(gè)屬性需要處理:瀏覽器顯示視窗的展示位置比如寬(width)、高(height);網(wǎng)頁(yè)文檔的大小屬性比如其展示時(shí)其整體的寬(width)、高(height);文檔中各元素在頁(yè)面中的展示位置，比如對(duì)于視頻元素有:寬(width)、高(height)、距離頁(yè)面頂部的距離(top)、距離頁(yè)面左側(cè)的距離(left)等)；滾動(dòng)條的展示位置，比如距離顯示視窗頂部的距離(top)，距離顯示視窗左側(cè)的距離(left)等。
[0089]然后，在拖動(dòng)過程中即可根據(jù)上述位置屬性計(jì)算所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示。
[0090]步驟240，所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0091]在本發(fā)明實(shí)施例中，步驟240為實(shí)施例一步驟140優(yōu)選的子步驟。
[0092]優(yōu)選地，所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示，包括:
[0093]子步驟S242，將所述視頻元素的顯示位置中顯示尺寸進(jìn)行縮放，將所述顯示位置的中定位參數(shù)修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示。
[0094]對(duì)于前述加載后的網(wǎng)頁(yè)文檔，將初始的網(wǎng)頁(yè)文檔中的視頻元素，將視頻元素的初始顯示尺寸進(jìn)行縮放，比如視頻元素初始寬為600px (px,像素)，高為400px，那么可將其寬縮放為150Px，高縮放為ΙΟΟρχ。
[0095]上述縮放可按比例縮放，比如縮放為原來的1/4大小，具體縮放比例可以根據(jù)實(shí)際頁(yè)面顯示大小設(shè)置，本發(fā)明不對(duì)其加以限制。
[0096]同時(shí)，對(duì)于視頻元素在網(wǎng)頁(yè)中初始所在的位置，將其位置參數(shù)進(jìn)行修改，比如初始情況下，視頻元素的距離網(wǎng)頁(yè)頂部的距離為200px，距離網(wǎng)頁(yè)左側(cè)的距離為ΙΟΟρχ，那么可以將這個(gè)定位參數(shù)修改為距離顯示視窗底部距離為0，距離網(wǎng)頁(yè)右側(cè)距離為O。具體的定位參數(shù)的修改可根據(jù)實(shí)際情況選擇，只要使視頻元素可以在顯示視窗中顯示即可。
[0097]當(dāng)然,還會(huì)修改視頻元素當(dāng)前的z-1ndex的值,使其處于頁(yè)面的最頂層,不至于被其他元素遮擋。實(shí)際上，z-1ndex的值越大，代表其層級(jí)越高，本發(fā)明中只需要保證z-1ndex的值是HTML中所有元素涉及z-1ndex值中最大的即可
[0098]優(yōu)選的，所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示包括:
[0099]子步驟S2421，在網(wǎng)頁(yè)HTML的CSS文件中，將所述視頻元素的CSS樣式的顯示位置修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示，將所述CSS樣式的顯示層索引修改為頂層的索引參數(shù)。
[0100]瀏覽器是通過對(duì)HTML文檔(HTML,超文本標(biāo)記語(yǔ)言,Hypertext Markup Language)進(jìn)行解析，然后進(jìn)行渲染的，HTML文檔一般是幾個(gè)部分:
[0101]其一，包括可以解析為DOM樹(D0M，文件對(duì)象模型Document Object)的內(nèi)容。
[0102]DOM是一種與平臺(tái)和語(yǔ)言無關(guān)的接口，它允許程序和腳本動(dòng)態(tài)訪問和修改文檔的內(nèi)容、結(jié)構(gòu)和類型。它定義了一系列的對(duì)象和方法對(duì)DOM樹的節(jié)點(diǎn)進(jìn)行各種隨機(jī)操作:
[0103].Document對(duì)象:作為樹的最高節(jié)點(diǎn),Document對(duì)象是對(duì)整個(gè)文檔進(jìn)行操作的入□。
[0104].Element和Attr對(duì)象:這些節(jié)點(diǎn)對(duì)象都是網(wǎng)頁(yè)文檔某一部分的映射,節(jié)點(diǎn)的定級(jí)層次恰好反映了文檔的結(jié)構(gòu)。
[0105].Text對(duì)象:作為Element和Attr對(duì)象的子節(jié)點(diǎn)，Text對(duì)象表達(dá)了元素或?qū)傩缘奈谋緝?nèi)容。Text節(jié)點(diǎn)不再包含任何子節(jié)點(diǎn)。
[0106]DOM樹中的所有節(jié)點(diǎn)都是從節(jié)點(diǎn)對(duì)象繼承而來的，節(jié)點(diǎn)對(duì)象定義了一些最基本的屬性和方法，利用這些方法可以實(shí)現(xiàn)對(duì)樹的遍歷，同時(shí)，根據(jù)屬性還可以得知節(jié)點(diǎn)的名稱、取值并判斷其類型。
[0107]其二，為控制每個(gè)DOM的節(jié)點(diǎn)的呈現(xiàn)方式(比如位置、大小)的CSS樣式(CSSjS聯(lián)樣式表，Cascading Style Sheet)。
[0108]實(shí)際上，本發(fā)明對(duì)于DOM樹本身沒有進(jìn)行任何改變，只是對(duì)于視頻元素的CSS樣式進(jìn)行了更改，即將針對(duì)視頻元素的CSS樣式中的參數(shù)，比如寬、高、定位參數(shù)(如距離頁(yè)面頂部的距離、距離頁(yè)面左側(cè)的距離)、視頻元素的顯示層級(jí)z-1ndex。
[0109]優(yōu)選地，將所述視頻元素的CSS樣式的顯示位置修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示包括:
[0110]子步驟S244，針對(duì)所述視頻元素的CSS樣式，將所述CSS樣式的顯示位置中的定位參數(shù)相對(duì)滾動(dòng)條位置進(jìn)行修改。
[0111]在實(shí)際應(yīng)用中，可將前述視頻元素的CSS樣式定位參數(shù)(如距離頁(yè)面頂部的距離、距離頁(yè)面左側(cè)的距離)修改為距離滾動(dòng)條位置指定距離，比如修改視頻元素頂部距滾動(dòng)條頂部距離為m ;當(dāng)滾動(dòng)條頂部到滾動(dòng)槽底部的距離值h小于m時(shí)，設(shè)視頻元素的高度j時(shí)，m值修改為h-j。當(dāng)然，還可以將所述定位參數(shù)相對(duì)滾動(dòng)條進(jìn)行其他設(shè)置，本發(fā)明不對(duì)其加以限制。
[0112]優(yōu)選地，將所述視頻元素的CSS樣式的顯示位置修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示包括:
[0113]子步驟S246，針對(duì)所述視頻元素的CSS樣式，將所述CSS樣式的顯示位置中的定位參數(shù)相對(duì)顯示視窗位置進(jìn)行修改。
[0114]在實(shí)際應(yīng)用中，可將前述視頻元素的CSS樣式定位參數(shù)(如距離頁(yè)面頂部的距離、距離頁(yè)面左側(cè)的距離)相對(duì)顯示視窗位置進(jìn)行修改。比如將視頻元素固定在右下角顯示，即修改CSS樣式的定位參數(shù)為到顯示視窗右側(cè)距離為0，到底部距離為O ;或者固定在左下角顯示等等。當(dāng)然，具體顯示位置本發(fā)明不對(duì)其加以限制。
[0115]在上述步驟中，視頻元素只是從網(wǎng)頁(yè)文檔的初始位置移動(dòng)至另外一個(gè)位置進(jìn)行顯示，其DIV結(jié)構(gòu)并沒有改變，其內(nèi)部的除了顯示尺寸和顯示位置參數(shù)、顯示層索引參數(shù)改變了，其他屬性及參數(shù)可以不用改變。即相當(dāng)于將初始位置的播放區(qū)域移動(dòng)至了顯示視窗中進(jìn)行顯示，移動(dòng)后的播放區(qū)域本身除了大小與初始的不同，其他的基本一樣。
[0116]進(jìn)一步的，本發(fā)明可以對(duì)移動(dòng)后的視頻元素的播放區(qū)域進(jìn)行改變。即優(yōu)選的，所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示包括:
[0117]子步驟S248，將所述視頻元素中的控制按鈕隱藏。
[0118]在實(shí)際應(yīng)用中，本發(fā)明可將除了播放視頻內(nèi)容的界面進(jìn)行顯示以外，視頻元素中其他界面均可進(jìn)行隱藏，比如把控制按鈕隱藏，播放區(qū)域的邊界隱藏，使用戶只用看到播放視頻內(nèi)容的界面而不受視頻元素其他按鈕界面的影響。比如將控制按鈕的display或者visibilitys屬性值修改為不可見。
[0119]在子步驟S248之后，還包括:
[0120]子步驟S2481，當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，顯示所述視頻元素中的控制按鈕。
[0121]即在播放控制按鈕的CSS樣式中將其是否顯示的屬性從隱藏修改為顯示。比如將控制按鈕的display或者visibilitys屬性值修改為可見。
[0122]優(yōu)選地，在所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示之后，還包括:
[0123]子步驟S250，獲取當(dāng)前視頻元素中播放的視頻的關(guān)聯(lián)視頻信息；當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，在視頻元素顯示供所述關(guān)聯(lián)視頻信息并提供點(diǎn)擊接口。
[0124]在實(shí)際應(yīng)用中，可能一個(gè)帶有視頻元素的網(wǎng)頁(yè)中，存在大量與視頻相關(guān)聯(lián)的視頻信息，本發(fā)明可在顯示腳本中加入子步驟S250的邏輯，獲取當(dāng)前視頻元素中播放的視頻的關(guān)聯(lián)視頻信息；當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，在視頻元素顯示供所述關(guān)聯(lián)視頻信息并提供點(diǎn)擊接口。
[0125]當(dāng)在視頻元素顯示位置,監(jiān)控到鼠標(biāo)懸浮事件(onmouseover事件)時(shí),在視頻元素中顯示所述關(guān)聯(lián)視頻信息并提供點(diǎn)擊接口。在顯示相關(guān)視頻信息時(shí)，可在視頻元素的播放視頻內(nèi)容的播放區(qū)域之外的其他位置顯示。當(dāng)然，也可以在視頻元素中添加新的展示界面，用以顯示關(guān)聯(lián)視頻信息并針對(duì)每個(gè)視頻信息提供點(diǎn)擊接口。
[0126]當(dāng)用戶點(diǎn)擊針對(duì)某個(gè)視頻Q的點(diǎn)擊接口，則在視頻元素的播放區(qū)域中播放該視頻Q0
[0127]當(dāng)偵測(cè)到用戶沒有點(diǎn)擊動(dòng)作，鼠標(biāo)移開視頻元素顯示位置后，即偵測(cè)到移出視頻元素顯示位置的onmouseout事件后，則隱藏所述關(guān)聯(lián)視頻信息及其點(diǎn)擊接口。
[0128]優(yōu)選地，在所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示之后，還包括:
[0129]子步驟S252，當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，加載并展示針對(duì)當(dāng)前視頻內(nèi)容的功能接口 ；所述功能接口包括下載接口、和/或分享接口、和/或收藏接口、和/或調(diào)用第三方視頻播放軟件播放所述視頻內(nèi)容接口中至少一個(gè)。
[0130]在顯示控制腳本中，還可以加入子步驟S252的邏輯，在瀏覽器中加載執(zhí)行上述邏輯的模塊。即當(dāng)在視頻元素的顯示位置偵聽到鼠標(biāo)懸停事件后，在視頻元素中添加針對(duì)當(dāng)前視頻內(nèi)容的功能接口，所述功能接口包括下載接口、和/或分享接口、和/或收藏接口、和/或調(diào)用第三方視頻播放軟件播放所述視頻內(nèi)容接口中至少一個(gè)。所述下載接口用于調(diào)用瀏覽器的下載組件下載當(dāng)前播放的視頻。所述分享接口用于將當(dāng)前的視頻分享到指定的網(wǎng)站，比如人人網(wǎng)，新浪微博等網(wǎng)站。所述調(diào)用第三方視頻播放軟件播放所述視頻內(nèi)容接口包括調(diào)用PPS播放器等播放軟件，在該播放軟件中播放視頻。
[0131]優(yōu)選地，在所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示之后，還包括:
[0132]子步驟S254，當(dāng)偵聽到針對(duì)視頻元素顯示位置的尺寸變更操作時(shí)，根據(jù)拖拽動(dòng)作修改視頻元素CSS文件中的顯示尺寸。
[0133]在本發(fā)明實(shí)施例中，在視頻元素顯示位置的邊框處提供可變更視頻元素尺寸的功能。當(dāng)在視頻元素的邊框處偵聽到鼠標(biāo)焦點(diǎn)，則觸發(fā)邊框拉動(dòng)箭頭，當(dāng)再偵聽到鼠標(biāo)按下+拖動(dòng)的拖拽動(dòng)作時(shí)，即再偵聽到onmousedown+onmousemove事件時(shí)，則將視頻元素的尺寸隨著拖拽動(dòng)作變大或者變小。在變更視頻元素尺寸時(shí)，根據(jù)鼠標(biāo)的拖動(dòng)坐標(biāo)，修改視頻元素CSS文件中的顯示尺寸，比如將視頻元素的寬高隨著鼠標(biāo)的拖拽進(jìn)行更改。當(dāng)偵聽到鼠標(biāo)放開事件(onmouseup事件)時(shí),則固定當(dāng)前視頻元素的顯示尺寸。
[0134]優(yōu)選地，在所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示之后，還包括:
[0135]子步驟S256，當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，觸發(fā)對(duì)所述視頻元素中播放內(nèi)容的暫停操作；當(dāng)鼠標(biāo)移出所述視頻元素顯示位置后，再繼續(xù)播放所述視頻內(nèi)容。
[0136]在本發(fā)明實(shí)施例中，還可提供便捷的暫停和播放功能，即當(dāng)在視頻元素的顯示位置偵聽到鼠標(biāo)懸停事件后，觸發(fā)對(duì)所述視頻元素中播放內(nèi)容的暫停操作；當(dāng)鼠標(biāo)移出所述視頻元素顯示位置后，再繼續(xù)播放所述視頻內(nèi)容。
[0137]在實(shí)際中，頁(yè)面剛加載完成時(shí)的初始視頻元素中，存在播放/暫停按鈕，本發(fā)明則將需要點(diǎn)擊播放/暫停按鈕的情況，修改為用戶鼠標(biāo)滑動(dòng)至視頻元素的顯示位置即可暫停視頻，滑出所述顯示位置，視頻繼續(xù)播放。
[0138]另外，當(dāng)存在子步驟S2481，子步驟S250，子步驟S252，子步驟S256中多個(gè)功能時(shí)，則可將視頻元素的顯示區(qū)域根據(jù)上述功能的個(gè)數(shù)進(jìn)行劃分，每個(gè)區(qū)域接收到的鼠標(biāo)懸停事件負(fù)責(zé)觸發(fā)一個(gè)功能。
[0139]優(yōu)選地，在所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示之后，還包括:
[0140]子步驟S258，當(dāng)在所述視頻元素的顯示位置偵聽到拖拽動(dòng)作后，將所述視頻元素的顯示位置的位置隨著拖拽動(dòng)作移動(dòng)。
[0141]當(dāng)在所述視頻元素的顯示位置偵聽到onmousedown+onmousemove事件時(shí),拖動(dòng)視頻元素的整體顯示位置，不改變視頻元素的顯示尺寸。在本發(fā)明實(shí)施例中，一般是在視頻元素的視頻播放區(qū)域偵聽到onmousedown+onmousemove事件時(shí),視頻的整體顯示位置隨著拖拽變化而變化。
[0142]優(yōu)選地，將所述視頻元素的顯示位置的位置隨著拖拽動(dòng)作移動(dòng)包括:
[0143]子步驟S2581，在對(duì)應(yīng)所述視頻元素的CSS樣式中，將視頻元素的定位參數(shù)隨著在網(wǎng)頁(yè)視窗區(qū)域內(nèi)拖拽的位置參數(shù)而改變。
[0144]即在實(shí)際應(yīng)用中，可以根據(jù)鼠標(biāo)的坐標(biāo)修改視頻元素的CSS樣式中的定位參數(shù)，比如修改視頻元素距離顯示視窗頂部的距離和距離顯示視窗左側(cè)的距離，如此即可將視頻元素隨著鼠標(biāo)的拖動(dòng)而改變顯示的位置。
[0145]優(yōu)選地，在所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示之前，還包括:
[0146]子步驟S260，判斷當(dāng)前網(wǎng)頁(yè)中是否存在多個(gè)視頻元素；如果存在，則提示用戶選擇進(jìn)行小窗顯示的視頻元素并提供選擇接口 ；對(duì)于用戶未選擇的視頻元素，停止判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示。
[0147]在本發(fā)明的顯示腳本可以通過視頻標(biāo)簽識(shí)別頁(yè)面文檔中的各個(gè)視頻元素；所述視頻標(biāo)簽比如〈video〉標(biāo)簽，比如〈embed〉標(biāo)簽中的type類型,如果其為視頻類型即表明對(duì)應(yīng)的元素為視頻元素，或者判斷該標(biāo)簽中的id =“flash”、“media”等值，也可判斷元素為視頻元素；比如〈object〉中type類型，如果其為視頻類型即表明對(duì)應(yīng)的元素為視頻元素，或者判斷該標(biāo)簽中的id，id =“flash”、“media”等值，也可判斷元素為視頻元素。
[0148]那么當(dāng)存在多個(gè)視頻元素時(shí)，提取視頻元素的主題名稱，然后生成彈出框，在彈出框中以所述主題名稱生成選擇項(xiàng)以供用戶勾選，同時(shí)提示用戶是否選擇將某些視頻元素進(jìn)行小窗播放功能(可以理解為本發(fā)明實(shí)施例中的獨(dú)立顯示功能)。當(dāng)用戶勾選一個(gè)或者多個(gè)選項(xiàng)并確定后，顯示控制腳本對(duì)于未選擇的視頻元素，則停止對(duì)其執(zhí)行后續(xù)邏輯，對(duì)用戶勾選的視頻元素，則執(zhí)行后續(xù)邏輯。
[0149]進(jìn)一步的，所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示之后，還包括:
[0150]步驟S262，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0151]優(yōu)選地,將所述視頻元素還原至初始顯示位置包括:
[0152]子步驟S2621，在網(wǎng)頁(yè)HTML的CSS文件中，將所述視頻元素的CSS樣式的顯示位置修改為在初始的顯示位置，將所述CSS樣式的顯示層索引修改為初始的索引參數(shù)。
[0153]本步驟為與子步驟S2421相反的步驟，即將小窗播放的視頻元素的SS樣式的顯示位置還原至其初始的顯示位置，即還原為網(wǎng)頁(yè)剛加載完后視頻元素的顯示位置；將所述CSS樣式的顯示層索引修改為初始的索引參數(shù)，即還原為網(wǎng)頁(yè)剛加載完后視頻元素的顯示層索引。
[0154]本發(fā)明與實(shí)施例一類似的步驟原理類似，在此不再詳述。
[0155]本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放方法可以對(duì)瀏覽器側(cè)獲取的網(wǎng)頁(yè)文檔加入顯示控制腳本，該顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示后，修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示，由此解決了用戶滑動(dòng)頁(yè)面時(shí)，當(dāng)視頻元素移出顯示視窗之后，用戶瀏覽網(wǎng)頁(yè)中的信息時(shí)無法同時(shí)觀看視頻元素中的播放內(nèi)容的問題，時(shí)取得了可以在網(wǎng)頁(yè)文檔中視頻元素的初始位置移出顯示視窗之后，使視頻元素出現(xiàn)在顯示視窗中展示，在用戶瀏覽器網(wǎng)頁(yè)中其他信息(比如視頻評(píng)論、推薦視頻等)時(shí)可以同時(shí)觀看視頻元素中的播放內(nèi)容的有益效果。
[0156]實(shí)施例三
[0157]參照?qǐng)D3，其示出了本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放方法，具體可以包括:
[0158]步驟310，從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0159]步驟320，判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0160]如圖3A，為瀏覽器加載顯示網(wǎng)頁(yè)文檔的示例；S312為瀏覽器顯示視窗，S313為視頻元素的顯示窗口，S314為滾動(dòng)條，S315為滾動(dòng)槽，瀏覽器的其他部件在此省略。在本發(fā)明實(shí)施例中，圖3A是網(wǎng)頁(yè)文檔加載完成后，用戶還未被用戶拖動(dòng)時(shí)的初始狀態(tài)示意圖，即瀏覽器加載完網(wǎng)頁(yè)文檔，還未檢測(cè)到任何onsc1ll事件。其中，S313所示窗口的當(dāng)前的顯示位置為視頻元素的初始顯示位置。
[0161]步驟330，根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0162]在瀏覽器的渲染引擎渲染HTML文檔時(shí)，渲染后的頁(yè)面的高度一般都會(huì)大于顯示視窗S312的高度，而滾動(dòng)條的滾動(dòng)比例會(huì)根據(jù)頁(yè)面的高度變化。所述滾動(dòng)比例為滾動(dòng)條每滾動(dòng)Ipx頁(yè)面滾動(dòng)的Npx。N ^ I的整數(shù)。
[0163]那么本發(fā)明可根據(jù)頁(yè)面的高度a，顯示視窗的高度b，滾動(dòng)條的長(zhǎng)度f計(jì)算所述滾動(dòng)比例g，其計(jì)算公式可為g = a/(b-f)。即計(jì)算滾動(dòng)在滾動(dòng)槽中可滾動(dòng)的長(zhǎng)度與頁(yè)面的高度之間的比例。
[0164]在本發(fā)明實(shí)施例中可以通過document, body, scrolIHeight函數(shù)獲取網(wǎng)頁(yè)文檔的高度，即a ;可通過document, body.clientHeight函數(shù)獲取顯示視窗的高，即b,用GetScrollInfo函數(shù)獲取滾動(dòng)條的高，即C。
[0165]步驟340，獲取所述視頻元素顯示位置中，在視頻元素高度范圍內(nèi)的高度值到顯示視窗頂部的距離閾值L ;
[0166]在本發(fā)明實(shí)施例中，可以選擇在視頻元素的一部分被遮擋了，再以執(zhí)行后續(xù)邏輯以小窗口的模式播放。即可以在視頻元素的高q的范圍內(nèi)選擇一個(gè)位置，計(jì)算什么時(shí)候開始進(jìn)入小窗播放模式。
[0167]比如圖3A中，選擇在視頻元素高的一半q/2處，即視頻元素被遮擋了一半時(shí)即進(jìn)入小窗模式，那么首先需要技術(shù)顯示視窗頂部至視頻元素q/2處的距離L。
[0168]在本發(fā)明實(shí)施例中，獲取所述L的值有多種方法，比如通過getBoundingClientRect O方法獲取視頻元素左上角至顯示視窗頂部的距離k,然后k+q/2=L。
[0169]步驟350，根據(jù)所述滾動(dòng)比例和距離閾值L確定滾動(dòng)條需要滾動(dòng)的第一閾值；
[0170]在獲得L后，只需要計(jì)算滾動(dòng)條的滾動(dòng)的第一閾值。比如滾動(dòng)比例為1:10，即滾動(dòng)條滾動(dòng)lpx，頁(yè)面滾動(dòng)1px, L = 200px,那么L*l/10 = 20px,也即滾動(dòng)條需要滾動(dòng)20px。
[0171]步驟360，判斷滾動(dòng)條滾動(dòng)的距離C是否達(dá)到第一閾值；當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第一閾值時(shí)，則判斷出所述視頻元素部分顯示或者全部地未被顯示。
[0172]如前述例子，當(dāng)滾動(dòng)條滾動(dòng)了 20px距離，即判斷所述視頻元素部分顯示或者全部地未被顯示，達(dá)到需要進(jìn)入小窗口播放模式的時(shí)刻，進(jìn)入步驟370。如圖3B所示，在此刻開始由步驟370進(jìn)入小窗播放模式，即圖3B中的小窗口 S316中播放視頻內(nèi)容。只要用戶在此刻一直往下滑動(dòng)，小窗模式就一直存在。當(dāng)判斷視頻元素還是全部的顯示在顯示視窗中時(shí)，則保持網(wǎng)頁(yè)的初始展示狀態(tài)。
[0173]在本發(fā)明實(shí)施例中可以通過onsroll事件剛觸發(fā)時(shí)，獲取滾動(dòng)條的top屬性Pl (即距離頁(yè)面頂部距離)，然后在滾動(dòng)過程中實(shí)時(shí)獲取所述top屬性p2，由p2_pl即可得知滾動(dòng)條滾動(dòng)距離。
[0174]當(dāng)然，如果是在頁(yè)面初始加載后,用戶第一次觸發(fā)onsroll事件,可以直接以top屬性值作為滾動(dòng)條滾動(dòng)距離。
[0175]如果滾動(dòng)條沒滾動(dòng)到20px。則判斷所述不需要進(jìn)入小窗口播放模式，不進(jìn)行步驟370。
[0176]步驟340-步驟360可以理解為實(shí)施例一中“根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示”的【具體實(shí)施方式】。
[0177]步驟370，判斷出所述視頻元素部分顯示和/或全部地未被顯示，則所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0178]在步驟360，中當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第一閾值時(shí)，即判斷出所述視頻元素部分顯示和/或全部地未被顯示。
[0179]進(jìn)一步的，所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示之后，還包括:
[0180]步驟380，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0181]優(yōu)選地，獲取所述視頻元素顯示位置中，在視頻元素高度范圍內(nèi)的高度值到顯示視窗頂部的距離閾值L包括:
[0182]子步驟341，在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值L。
[0183]在本發(fā)明實(shí)施例中，在網(wǎng)頁(yè)加載完成后，用戶未對(duì)網(wǎng)頁(yè)做任何操作之前，所述視頻元素顯示位置中，在視頻元素高度范圍內(nèi)的高度值到顯示視窗頂部的距離閾值L是固定的。
[0184]此時(shí)，對(duì)于使用絕對(duì)定位的視頻元素，其top值(視頻元素頂部到網(wǎng)頁(yè)頂部的距離)，與視頻元素頂部到顯示視窗頂部的距離是一樣的，因此可以直接獲取視頻元素的所述top值，加上選擇的視頻元素的觸發(fā)高度，比如隱藏q/2時(shí)就進(jìn)入開始進(jìn)入小窗播放模式，那么 L = top 值 +q/2 ；
[0185]然后L結(jié)合滾動(dòng)比例計(jì)算第一閾值，在該步驟之后，可以分配很小的內(nèi)存空間記錄所述第一閾值，此時(shí)只需要獲取滾動(dòng)條的top屬性，將滾動(dòng)條的top屬性，與記錄的第一閾值進(jìn)行比較即可判斷是否進(jìn)入小窗播放模式，或者判斷從小窗播放模式還原為初始的網(wǎng)頁(yè)樣式。其計(jì)算速度快，不需要后續(xù)在計(jì)算滾動(dòng)比例，L值，以及第一閾值。
[0186]在本發(fā)明實(shí)施例中還可設(shè)置L的其他值，比如L = top值，即視頻元素頂部距離顯示視窗頂部的距離，為判斷顯示視窗開始部分被顯示。也可設(shè)置L = top值+q，即視頻元素開始全部未被顯示。在視頻元素被判斷為部分被全部顯示時(shí)和/或全部未被顯示時(shí)均可進(jìn)入以圖3B中將視頻元素調(diào)整為小窗口 S316播放的模式。
[0187]本發(fā)明與實(shí)施例一、實(shí)施例二類似的步驟原理類似，在此不再詳述。本發(fā)明實(shí)施例與實(shí)施例一、實(shí)施例二的類似步驟也可以挪用到本實(shí)施例中，具體原理不再詳述。
[0188]本發(fā)明實(shí)施例可以選擇視頻元素未顯示的部分有多少時(shí)，才進(jìn)入小窗播放模式。
[0189]本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放方法可以對(duì)瀏覽器側(cè)獲取的網(wǎng)頁(yè)文檔加入顯示控制腳本，該顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示后，修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示，由此解決了用戶滑動(dòng)頁(yè)面時(shí)，當(dāng)視頻元素移出顯示視窗之后，用戶瀏覽網(wǎng)頁(yè)中的信息時(shí)無法同時(shí)觀看視頻元素中的播放內(nèi)容的問題，時(shí)取得了可以在網(wǎng)頁(yè)文檔中視頻元素的初始位置移出顯示視窗之后，使視頻元素出現(xiàn)在顯示視窗中展示，在用戶瀏覽器網(wǎng)頁(yè)中其他信息(比如視頻評(píng)論、推薦視頻等)時(shí)可以同時(shí)觀看視頻元素中的播放內(nèi)容的有益效果。
[0190]實(shí)施例四
[0191]參照?qǐng)D4，其示出了本發(fā)明的優(yōu)選地一種網(wǎng)頁(yè)中視頻元素的播放方法，具體可以包括:
[0192]步驟410，從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0193]步驟420，判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0194]步驟430，根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0195]步驟440，獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值A(chǔ);
[0196]該距離閾值A(chǔ)即視頻元素頂部至顯示視窗頂部的距離。
[0197]步驟450，根據(jù)所述滾動(dòng)比例和距離閾值A(chǔ)確定滾動(dòng)條需要滾動(dòng)的第二閾值；
[0198]步驟460，判斷滾動(dòng)條滾動(dòng)的距離C是否達(dá)到第二閾值；當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第二閾值時(shí)，則判斷出所述視頻元素部分顯示。
[0199]判斷所述視頻元素部分顯示后，進(jìn)入步驟470。
[0200]在圖3A的基礎(chǔ)上，本實(shí)施例變化至圖4A，在視頻元素底部與顯示視窗頂部重合的時(shí)候，即進(jìn)入小窗播放模式。其中瀏覽器加載顯示網(wǎng)頁(yè)文檔的示例；S412為瀏覽器顯示視窗，S413為原網(wǎng)頁(yè)中視頻元素的顯示窗口，S414為滾動(dòng)條，S415為滾動(dòng)槽，瀏覽器的其他部件在此省略。此時(shí)會(huì)觸發(fā)小窗口模式S416,只要用戶在此刻一直往下滑動(dòng),小窗口模式就一直存在。當(dāng)判斷視頻元素還是全部的顯示在顯示視窗中時(shí)，則保持網(wǎng)頁(yè)的初始展示狀態(tài)。
[0201]步驟430-步驟360可以理解為實(shí)施例一中“根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示”的【具體實(shí)施方式】。
[0202]步驟470，判斷出所述視頻元素部分顯示，則所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯不O
[0203]在步驟460中，當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第二閾值時(shí)，即判斷出所述視頻元素部分顯示。
[0204]優(yōu)選地，所述步驟440包括:
[0205]子步驟441，在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值A(chǔ)。
[0206]優(yōu)選地，所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示之后，還包括:
[0207]子步驟442，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0208]進(jìn)一步的，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置，包括:
[0209]子步驟443，當(dāng)視頻元素開始部分顯示后，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述滾動(dòng)條距離所述顯示視窗頂部的距離是否小于所述第二閾值；如果小于所述第二閾值，判斷所述顯示視窗開始全部顯示所述視頻元素的初始顯示位置；
[0210]在本發(fā)明實(shí)施例中，可在網(wǎng)頁(yè)加載完成后，用戶第一次觸發(fā)onsroll事件之前就計(jì)算并記錄所述第二閾值。那么后續(xù)的如果用戶向上滑動(dòng)網(wǎng)頁(yè)，那么即可判斷滾動(dòng)條頂部距離顯示視窗頂部的距離是否小于所述記錄的第二閾值，即可判斷視頻元素的初始顯示位置已經(jīng)出現(xiàn)在顯示視窗中，此時(shí)即可將視頻元素還原至其初始的顯示位置，停用小窗播放模式。
[0211]本發(fā)明與實(shí)施例一至實(shí)施例三類似的步驟原理類似，在此不再詳述。本發(fā)明實(shí)施例與實(shí)施例一至實(shí)施例三的類似步驟也可以挪用到本實(shí)施例中，具體原理不再詳述。
[0212]本發(fā)明實(shí)施例為視頻元素開始進(jìn)入未完全顯示狀態(tài)時(shí)即進(jìn)入小窗播放模式的實(shí)施例。
[0213]本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放方法可以對(duì)瀏覽器側(cè)獲取的網(wǎng)頁(yè)文檔加入顯示控制腳本，該顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示后，修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示，由此解決了用戶滑動(dòng)頁(yè)面時(shí)，當(dāng)視頻元素移出顯示視窗之后，用戶瀏覽網(wǎng)頁(yè)中的信息時(shí)無法同時(shí)觀看視頻元素中的播放內(nèi)容的問題，時(shí)取得了可以在網(wǎng)頁(yè)文檔中視頻元素的初始位置移出顯示視窗之后，使視頻元素出現(xiàn)在顯示視窗中展示，在用戶瀏覽器網(wǎng)頁(yè)中其他信息(比如視頻評(píng)論、推薦視頻等)時(shí)可以同時(shí)觀看視頻元素中的播放內(nèi)容的有益效果。
[0214]實(shí)施例五
[0215]參照?qǐng)D5，其示出了本發(fā)明的最優(yōu)的一種網(wǎng)頁(yè)中視頻元素的播放方法，具體可以包括:
[0216]步驟510，從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0217]步驟520，判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0218]步驟530，根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0219]步驟540，獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值B ;
[0220]該距離閾值為視頻元素頂部到顯示視窗頂部的距離加上視頻元素的高度。
[0221]步驟550 ;根據(jù)所述滾動(dòng)比例和距離閾值B確定滾動(dòng)條需要滾動(dòng)的第三閾值；
[0222]步驟560，當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第三閾值時(shí)，則判斷出所述視頻元素全部地未被顯不。
[0223]判斷所述視頻元素部分顯示后，進(jìn)入步驟570。
[0224]在圖3A的基礎(chǔ)上，本實(shí)施例變化至圖5A，在視頻元素頂部與顯示視窗頂部重合的時(shí)候，即進(jìn)入小窗播放模式。其中瀏覽器加載顯示網(wǎng)頁(yè)文檔的示例；S512為瀏覽器顯示視窗,S513為原網(wǎng)頁(yè)中視頻兀素的顯不窗口，S514為滾動(dòng)條,S515為滾動(dòng)槽,瀏覽器的其他部件在此省略。此時(shí)會(huì)觸發(fā)小窗口模式S516,只要用戶在此刻一直往下滑動(dòng),小窗模式就一直存在。
[0225]步驟530-步驟560可以理解為實(shí)施例一中“根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示”的【具體實(shí)施方式】。
[0226]步驟570，判斷出所述視頻元素全部地未被顯示，則所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0227]在步驟560，中當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第三閾值時(shí)，即判斷出所述視頻元素全部地未被顯不。
[0228]優(yōu)選地,所述步驟540包括:
[0229]子步驟541，在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值B。
[0230]優(yōu)選地，所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示之后，還包括:
[0231]子步驟542，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0232]進(jìn)一步的，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置，包括:
[0233]子步驟543，當(dāng)視頻元素開始部分顯示后，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述滾動(dòng)條距離所述顯示視窗頂部的距離是否小于所述第三閾值；如果小于所述第三閾值，判斷所述顯示視窗開始全部顯示所述視頻元素的初始顯示位置；
[0234]在本發(fā)明實(shí)施例中，可在網(wǎng)頁(yè)加載完成后，用戶第一次觸發(fā)onsroll事件之前就計(jì)算并記錄所述第三閾值。那么后續(xù)的如果用戶向上滑動(dòng)網(wǎng)頁(yè)，那么即可判斷滾動(dòng)條頂部距離顯示視窗頂部的距離是否小于所述記錄的第三閾值，即可判斷視頻元素的初始顯示位置已經(jīng)出現(xiàn)在顯示視窗中，此時(shí)即可將視頻元素還原至其初始的顯示位置，停用小窗播放模式。
[0235]本發(fā)明與實(shí)施例一至實(shí)施例四類似的步驟原理類似，在此不再詳述。本發(fā)明實(shí)施例與實(shí)施例一至實(shí)施例四的類似步驟也可以挪用到本實(shí)施例中，具體原理不再詳述。
[0236]本發(fā)明實(shí)施例為視頻元素開始完全未顯示時(shí)即進(jìn)入小窗播放模式的實(shí)施例。
[0237]本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放方法可以對(duì)瀏覽器側(cè)獲取的網(wǎng)頁(yè)文檔加入顯示控制腳本，該顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示后，修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示，由此解決了用戶滑動(dòng)頁(yè)面時(shí)，當(dāng)視頻元素移出顯示視窗之后，用戶瀏覽網(wǎng)頁(yè)中的信息時(shí)無法同時(shí)觀看視頻元素中的播放內(nèi)容的問題，時(shí)取得了可以在網(wǎng)頁(yè)文檔中視頻元素的初始位置移出顯示視窗之后，使視頻元素出現(xiàn)在顯示視窗中展示，在用戶瀏覽器網(wǎng)頁(yè)中其他信息(比如視頻評(píng)論、推薦視頻等)時(shí)可以同時(shí)觀看視頻元素中的播放內(nèi)容的有益效果。
[0238]當(dāng)然，在上述實(shí)施例之外，所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示還可包括:
[0239]通過獲取視頻元素距離網(wǎng)頁(yè)文檔頂部的距離了 LI,通過document, body.scrollTop函數(shù)獲取網(wǎng)頁(yè)文檔被卷去的高度L2，(也即網(wǎng)頁(yè)隱藏的高度)；當(dāng)1^1 =L2，則視頻元素開始進(jìn)入部分顯示階段；和/或者，當(dāng)L1〈L2〈L1+L3，其中L3為視頻元素高度，則視頻元素部分顯示；和/或者當(dāng)L2 ^ L1+L3，則視頻元素進(jìn)入視頻元素完畢未被顯示階段。
[0240]根據(jù)上述判斷結(jié)果即可修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0241]實(shí)施例六
[0242]參照?qǐng)D6，其示出了本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放裝置，具體可以包括:
[0243]網(wǎng)頁(yè)文檔獲取模塊610，適于從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0244]腳本加載模塊620，適于判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0245]顯示位置判斷模塊630，適于所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示；
[0246]顯示位置更改模塊640，適于通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。
[0247]優(yōu)選地，所述顯示位置更改模塊640包括:
[0248]元素位置更改模塊，適于所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0249]優(yōu)選地，在顯示位置更改模塊640之后，還包括:
[0250]關(guān)聯(lián)視頻接口提模塊，適于獲取當(dāng)前視頻元素中播放的視頻的關(guān)聯(lián)視頻信息；當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，在視頻元素顯示供所述關(guān)聯(lián)視頻信息并提供點(diǎn)擊接口。
[0251]優(yōu)選地，在顯示位置更改模塊640之后，還包括:
[0252]功能結(jié)構(gòu)提供模塊，適于當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，加載并展示針對(duì)當(dāng)前視頻內(nèi)容的功能接口 ；所述功能接口包括下載接口、和/或分享接口、和/或收藏接口、和/或調(diào)用第三方視頻播放軟件播放所述視頻內(nèi)容接口中至少一個(gè)。
[0253]優(yōu)選地，在顯示位置更改模塊640之后，還包括:
[0254]尺寸改變模塊，適于當(dāng)偵聽到針對(duì)視頻元素顯示位置的尺寸變更操作時(shí)，根據(jù)拖拽動(dòng)作修改視頻元素CSS文件中的顯示尺寸。
[0255]優(yōu)選地，在顯示位置判斷模塊630之前，還包括:
[0256]選擇提示模塊，適于判斷當(dāng)前網(wǎng)頁(yè)中是否存在多個(gè)視頻元素；如果存在，則提示用戶選擇進(jìn)行小窗顯示的視頻元素并提供選擇接口 ；對(duì)于用戶未選擇的視頻元素，停止判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示。
[0257]優(yōu)選地，在顯示位置更改模塊640之后，還包括:
[0258]暫停模塊，適于當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，觸發(fā)對(duì)所述視頻元素中播放內(nèi)容的暫停操作；當(dāng)鼠標(biāo)移出所述視頻元素顯示位置后，再繼續(xù)播放所述視頻內(nèi)容。
[0259]優(yōu)選地，在顯示位置更改模塊640之后，還包括:
[0260]位置移動(dòng)模塊，適于當(dāng)在所述視頻元素的顯示位置偵聽到拖拽動(dòng)作后，將所述視頻元素的顯示位置的位置隨著拖拽動(dòng)作移動(dòng)。
[0261]優(yōu)選地，所述位置移動(dòng)模塊包括:
[0262]第一位置移動(dòng)模塊，適于在對(duì)應(yīng)所述視頻元素的CSS樣式中，將視頻元素的定位參數(shù)隨著在網(wǎng)頁(yè)視窗區(qū)域內(nèi)拖拽的位置參數(shù)而改變。
[0263]優(yōu)選地，所述顯示位置更改模塊640之后，還包括:
[0264]還原判斷模塊，適于根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；適于如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0265]優(yōu)選地，所述還原判斷模塊包括:
[0266]CSS還原模塊，適于在網(wǎng)頁(yè)HTML的CSS文件中，將所述視頻元素的CSS樣式的顯示位置修改為在初始的顯示位置，將所述CSS樣式的顯示層索引修改為初始的索引參數(shù)。
[0267]實(shí)施例七
[0268]參照?qǐng)D7，其示出了本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放裝置，具體可以包括:
[0269]網(wǎng)頁(yè)文檔獲取模塊710，適于從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0270]腳本加載模塊720，適于判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0271]顯示位置判斷模塊730，適于所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示；
[0272]優(yōu)選地，所述顯示位置判斷模塊730包括:
[0273]第一顯示位置判斷模塊，適于根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示。
[0274]顯示位置更改模塊740,所述顯示位置更改模塊740包括:
[0275]元素位置更改模塊742，適于所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0276]優(yōu)選地，所述元素位置更改模塊742包括:
[0277]第一元素位置更改模塊，適于將所述視頻元素的顯示位置中顯示尺寸進(jìn)行縮放，將所述顯示位置的中定位參數(shù)修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示。
[0278]優(yōu)選地，所述第一元素位置更改模塊包括:
[0279]第二元素位置更改模塊，適于在網(wǎng)頁(yè)HTML的CSS文件中，將所述視頻元素的CSS樣式的顯示位置修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示，將所述CSS樣式的顯示層索引修改為頂層的索引參數(shù)。
[0280]優(yōu)選地，所述第二元素位置更改模塊包括:
[0281 ] 第一相對(duì)修改模塊，適于針對(duì)所述視頻元素的CSS樣式，將所述CSS樣式的顯示位置中的定位參數(shù)相對(duì)滾動(dòng)條位置進(jìn)行修改。
[0282]優(yōu)選地，所述第二元素位置更改模塊包括:包括:
[0283]第二相對(duì)修改模塊，適于針對(duì)所述視頻元素的CSS樣式，將所述CSS樣式的顯示位置中的定位參數(shù)相對(duì)顯示視窗位置進(jìn)行修改。
[0284]優(yōu)選地，所述元素位置更改模塊包括:
[0285]按鈕隱藏模塊，適于將所述視頻元素中的控制按鈕隱藏。
[0286]實(shí)施例八
[0287]參照?qǐng)D8，其示出了本發(fā)明的一種網(wǎng)頁(yè)中視頻元素的播放裝置，具體可以包括:
[0288]網(wǎng)頁(yè)文檔獲取模塊810，適于從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0289]腳本加載模塊820，適于判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0290]第一顯示位置判斷模塊830，所述第一顯示位置判斷模塊830包括；
[0291]第一滾動(dòng)比例計(jì)算模塊832，適于根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0292]第一滾動(dòng)距離獲取模塊834，適于獲取所述視頻元素顯示位置中，在視頻元素高度范圍內(nèi)的高度值到顯示視窗頂部的距離閾值L ;
[0293]第一滾動(dòng)閾值確定模塊836，適于根據(jù)所述滾動(dòng)比例和距離閾值L確定滾動(dòng)條需要滾動(dòng)的第一閾值；
[0294]第一元素判斷模塊838，適于當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第一閾值時(shí)，則判斷所述視頻元素部分顯示或者全部地未被顯示。
[0295]顯示位置更改模塊840,所述顯示位置更改模塊840包括:元素位置更改模塊842,適于所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0296]優(yōu)選地，所述顯示位置更改模塊840之后，還包括:
[0297]還原判斷模塊，適于根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；適于如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0298]實(shí)施例九
[0299]參照?qǐng)D9，其示出了本發(fā)明優(yōu)選地一種網(wǎng)頁(yè)中視頻元素的播放裝置，具體可以包括:
[0300]網(wǎng)頁(yè)文檔獲取模塊910，適于從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0301]腳本加載模塊920，適于判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0302]第一顯示位置判斷模塊930，所述第一顯示位置判斷模塊930包括；
[0303]第二滾動(dòng)比例計(jì)算模塊932，適于根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0304]第二滾動(dòng)距離獲取模塊934，適于獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值A(chǔ) ;
[0305]優(yōu)選地，所述第二滾動(dòng)距離獲取模塊包括:
[0306]第一觸發(fā)計(jì)算模塊，適于在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值A(chǔ)。
[0307]第二滾動(dòng)閾值確定模塊936，適于根據(jù)所述滾動(dòng)比例和距離閾值A(chǔ)確定滾動(dòng)條需要滾動(dòng)的第二閾值；
[0308]部分顯示判斷模塊938，適于當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第二閾值時(shí)，則判斷所述視頻元素部分顯示。
[0309]顯示位置更改模塊940,所述顯示位置更改模塊940包括:元素位置更改模塊942,適于所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0310]優(yōu)選地，所述顯示位置更改模塊940之后，還包括:
[0311]還原判斷模塊，適于根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；適于如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0312]優(yōu)選地，所述還原判斷模塊包括:
[0313]第一還原判斷模塊，適于當(dāng)視頻元素開始部分顯示后，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述滾動(dòng)條距離所述顯示視窗頂部的距離是否小于所述第二閾值；如果小于所述第二閾值，判斷所述顯示視窗開始全部顯示所述視頻元素的初始顯示位置；
[0314]實(shí)施例十
[0315]參照?qǐng)D10，其示出了本發(fā)明最優(yōu)的一種網(wǎng)頁(yè)中視頻元素的播放裝置，具體可以包括:
[0316]網(wǎng)頁(yè)文檔獲取模塊1010，適于從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0317]腳本加載模塊1020，適于判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0318]第一顯示位置判斷模塊1030，所述第一顯示位置判斷模塊1030包括；
[0319]第三滾動(dòng)比例計(jì)算模塊1032，適于根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0320]第三滾動(dòng)距離獲取模塊1034，適于獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值B;
[0321]優(yōu)選地，所述第二滾動(dòng)距離獲取模塊包括:
[0322]第一觸發(fā)計(jì)算模塊，適于在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值B。
[0323]第三滾動(dòng)距離獲取模塊1036，適于獲取所述視頻元素顯示位置的底部到顯示視窗頂部的距離閾值B;
[0324]全部未顯示判斷模塊1038，適于當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第三閾值時(shí)，則判斷所述視頻元素部分顯示。
[0325]顯示位置更改模塊1040，所述顯示位置更改模塊1040包括:元素位置更改模塊1042，適于所述顯示控制腳本修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0326]優(yōu)選地，所述顯示位置更改模塊1040之后，還包括:
[0327]還原判斷模塊，適于根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；適于如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0328]優(yōu)選地，所述還原判斷模塊包括:
[0329]第一還原判斷模塊，適于當(dāng)視頻元素開始部分顯示后，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述滾動(dòng)條距離所述顯示視窗頂部的距離是否小于所述第三閾值；如果小于所述第三閾值，判斷所述顯示視窗開始全部顯示所述視頻元素的初始顯示位置。
[0330]在此提供的算法和顯示不與任何特定計(jì)算機(jī)、虛擬系統(tǒng)或者其它設(shè)備固有相關(guān)。各種通用系統(tǒng)也可以與基于在此的示教一起使用。根據(jù)上面的描述，構(gòu)造這類系統(tǒng)所要求的結(jié)構(gòu)是顯而易見的。此外，本發(fā)明也不針對(duì)任何特定編程語(yǔ)言。應(yīng)當(dāng)明白，可以利用各種編程語(yǔ)言實(shí)現(xiàn)在此描述的本發(fā)明的內(nèi)容，并且上面對(duì)特定語(yǔ)言所做的描述是為了披露本發(fā)明的最佳實(shí)施方式。
[0331]在此處所提供的說明書中，說明了大量具體細(xì)節(jié)。然而，能夠理解，本發(fā)明的實(shí)施例可以在沒有這些具體細(xì)節(jié)的情況下實(shí)踐。在一些實(shí)例中，并未詳細(xì)示出公知的方法、結(jié)構(gòu)和技術(shù)，以便不模糊對(duì)本說明書的理解。
[0332]類似地，應(yīng)當(dāng)理解，為了精簡(jiǎn)本公開并幫助理解各個(gè)發(fā)明方面中的一個(gè)或多個(gè)，在上面對(duì)本發(fā)明的示例性實(shí)施例的描述中，本發(fā)明的各個(gè)特征有時(shí)被一起分組到單個(gè)實(shí)施例、圖、或者對(duì)其的描述中。然而，并不應(yīng)將該公開的方法解釋成反映如下意圖:即所要求保護(hù)的本發(fā)明要求比在每個(gè)權(quán)利要求中所明確記載的特征更多的特征。更確切地說，如下面的權(quán)利要求書所反映的那樣，發(fā)明方面在于少于前面公開的單個(gè)實(shí)施例的所有特征。因此，遵循【具體實(shí)施方式】的權(quán)利要求書由此明確地并入該【具體實(shí)施方式】，其中每個(gè)權(quán)利要求本身都作為本發(fā)明的單獨(dú)實(shí)施例。
[0333]本領(lǐng)域那些技術(shù)人員可以理解，可以對(duì)實(shí)施例中的設(shè)備中的模塊進(jìn)行自適應(yīng)性地改變并且把它們?cè)O(shè)置在與該實(shí)施例不同的一個(gè)或多個(gè)設(shè)備中?？梢园褜?shí)施例中的模塊或單元或組件組合成一個(gè)模塊或單元或組件，以及此外可以把它們分成多個(gè)子模塊或子單元或子組件。除了這樣的特征和/或過程或者單元中的至少一些是相互排斥之外，可以采用任何組合對(duì)本說明書(包括伴隨的權(quán)利要求、摘要和附圖)中公開的所有特征以及如此公開的任何方法或者設(shè)備的所有過程或單元進(jìn)行組合。除非另外明確陳述，本說明書(包括伴隨的權(quán)利要求、摘要和附圖)中公開的每個(gè)特征可以由提供相同、等同或相似目的的替代特征來代替。
[0334]此外，本領(lǐng)域的技術(shù)人員能夠理解，盡管在此所述的一些實(shí)施例包括其它實(shí)施例中所包括的某些特征而不是其它特征，但是不同實(shí)施例的特征的組合意味著處于本發(fā)明的范圍之內(nèi)并且形成不同的實(shí)施例。例如，在下面的權(quán)利要求書中，所要求保護(hù)的實(shí)施例的任意之一都可以以任意的組合方式來使用。
[0335]本發(fā)明的各個(gè)部件實(shí)施例可以以硬件實(shí)現(xiàn)，或者以在一個(gè)或者多個(gè)處理器上運(yùn)行的軟件模塊實(shí)現(xiàn)，或者以它們的組合實(shí)現(xiàn)。本領(lǐng)域的技術(shù)人員應(yīng)當(dāng)理解，可以在實(shí)踐中使用微處理器或者數(shù)字信號(hào)處理器(DSP)來實(shí)現(xiàn)根據(jù)本發(fā)明實(shí)施例的網(wǎng)頁(yè)中視頻元素的播放設(shè)備中的一些或者全部部件的一些或者全部功能。本發(fā)明還可以實(shí)現(xiàn)為用于執(zhí)行這里所描述的方法的一部分或者全部地設(shè)備或者裝置程序(例如，計(jì)算機(jī)程序和計(jì)算機(jī)程序產(chǎn)品)。這樣的實(shí)現(xiàn)本發(fā)明的程序可以存儲(chǔ)在計(jì)算機(jī)可讀介質(zhì)上，或者可以具有一個(gè)或者多個(gè)信號(hào)的形式。這樣的信號(hào)可以從因特網(wǎng)網(wǎng)站上下載得到，或者在載體信號(hào)上提供，或者以任何其他形式提供。
[0336]應(yīng)該注意的是上述實(shí)施例對(duì)本發(fā)明進(jìn)行說明而不是對(duì)本發(fā)明進(jìn)行限制，并且本領(lǐng)域技術(shù)人員在不脫離所附權(quán)利要求的范圍的情況下可設(shè)計(jì)出替換實(shí)施例。在權(quán)利要求中，不應(yīng)將位于括號(hào)之間的任何參考符號(hào)構(gòu)造成對(duì)權(quán)利要求的限制。單詞“包含”不排除存在未列在權(quán)利要求中的元件或步驟。位于元件之前的單詞“一”或“一個(gè)”不排除存在多個(gè)這樣的元件。本發(fā)明可以借助于包括有若干不同元件的硬件以及借助于適當(dāng)編程的計(jì)算機(jī)來實(shí)現(xiàn)。在列舉了若干裝置的單元權(quán)利要求中，這些裝置中的若干個(gè)可以是通過同一個(gè)硬件項(xiàng)來具體體現(xiàn)。單詞第一、第二、以及第三等的使用不表示任何順序?？蓪⑦@些單詞解釋為名稱。
[0337]本發(fā)明公開了 Al、一種網(wǎng)頁(yè)中視頻元素的播放方法，包括:
[0338]從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0339]判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0340]所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示；
[0341]通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。
[0342]A2、如Al所述的方法，所述判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)包括:
[0343]針對(duì)當(dāng)前網(wǎng)頁(yè)文檔對(duì)應(yīng)的網(wǎng)址，根據(jù)以通配符構(gòu)建的網(wǎng)址匹配規(guī)則和/或預(yù)置的網(wǎng)址名單，對(duì)所述網(wǎng)址進(jìn)行匹配；當(dāng)網(wǎng)址匹配上，則判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。
[0344]A3、如A2所述的方法，在網(wǎng)址匹配上之后，包括:
[0345]提取對(duì)應(yīng)所述網(wǎng)址的網(wǎng)頁(yè)架構(gòu)模板，并利用所述網(wǎng)頁(yè)架構(gòu)模板對(duì)所述網(wǎng)頁(yè)文檔進(jìn)行匹配；當(dāng)所述網(wǎng)頁(yè)文檔與上述網(wǎng)頁(yè)架構(gòu)模板匹配上，則判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。
[0346]A4、如Al所述的方法，所述將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示包括:
[0347]修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0348]A5、如A4所述的方法，所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示，包括:
[0349]根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯
/Jn ο
[0350]A6、如A5所述的方法，根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示包括:
[0351]根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0352]獲取所述視頻元素顯示位置中，在視頻元素高度范圍內(nèi)的高度值到顯示視窗頂部的距離閾值L ;
[0353]根據(jù)所述滾動(dòng)比例和距離閾值L確定滾動(dòng)條需要滾動(dòng)的第一閾值；
[0354]當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第一閾值時(shí)，則判斷所述視頻元素部分顯示或者全部地未被顯示。
[0355]A7、如A5所述的方法，根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示包括:
[0356]根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0357]獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值A(chǔ) ；
[0358]根據(jù)所述滾動(dòng)比例和距離閾值A(chǔ)確定滾動(dòng)條需要滾動(dòng)的第二閾值；
[0359]當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第二閾值時(shí)，則判斷所述視頻元素部分顯示。
[0360]AS、如A5所述的方法，根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中全部地未被顯示包括:
[0361]根據(jù)網(wǎng)頁(yè)整體大小屬性、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0362]獲取所述視頻元素顯示位置的底部到顯示視窗頂部的距離閾值B ；
[0363]根據(jù)所述滾動(dòng)比例和距離閾值B確定滾動(dòng)條需要滾動(dòng)的第三閾值；
[0364]當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第三閾值時(shí)，則判斷所述視頻元素全部地未被顯示。
[0365]A9、如A7所述的方法，獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值A(chǔ)包括:
[0366]在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值A(chǔ)。
[0367]A10、如AS所述的方法，所述獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值B包括:
[0368]在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值B。
[0369]All、如A7或AS所述的方法，所述通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0370]根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0371]A12、如All所述的方法，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置，包括:
[0372]當(dāng)視頻元素開始部分顯示后，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述滾動(dòng)條距離所述顯示視窗頂部的距離是否小于所述第二閾值；如果小于所述第二閾值，判斷所述顯示視窗開始全部顯示所述視頻元素的初始顯示位置；
[0373]或者，當(dāng)視頻元素開始全部地不被顯示后，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述滾動(dòng)條距離所述顯示視窗頂部的距離是否小于所述第三閾值；如果小于所述第三閾值，判斷所述顯示視窗開始全部顯示所述視頻元素的初始顯示位置。
[0374]A13、如All所述的方法，將所述視頻元素還原至初始顯示位置包括:
[0375]在網(wǎng)頁(yè)HTML的CSS文件中，將所述視頻元素的CSS樣式的顯示位置修改為在初始的顯示位置，將所述CSS樣式的顯示層索引修改為初始的索引參數(shù)。
[0376]A14、如A4所述的方法，所述修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示，包括:
[0377]將所述視頻元素的顯示位置中顯示尺寸進(jìn)行縮放，將所述顯示位置的中定位參數(shù)修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示。
[0378]A15、如A4所述的方法，所述修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示包括:
[0379]在網(wǎng)頁(yè)HTML的CSS文件中，將所述視頻元素的CSS樣式的顯示位置修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示，將所述CSS樣式的顯示層索引修改為頂層的索引參數(shù)。
[0380]A16、如A14所述的方法，將所述視頻元素的CSS樣式的顯示位置修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示包括:
[0381]針對(duì)所述視頻元素的CSS樣式，將所述CSS樣式的顯示位置中的定位參數(shù)相對(duì)滾動(dòng)條位置進(jìn)行修改。
[0382]A17、如A14所述的方法，將所述視頻元素的CSS樣式的顯示位置修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示包括:
[0383]針對(duì)所述視頻元素的CSS樣式，將所述CSS樣式的顯示位置中的定位參數(shù)相對(duì)顯示視窗位置進(jìn)行修改。
[0384]A18、如A4所述的方法，所述修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示包括:
[0385]將所述視頻元素中的控制按鈕隱藏。
[0386]A19、如Al所述的方法，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0387]獲取當(dāng)前視頻元素中播放的視頻的關(guān)聯(lián)視頻信息；當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，在視頻元素顯示供所述關(guān)聯(lián)視頻信息并提供點(diǎn)擊接口。
[0388]A20、如Al所述的方法，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0389]當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，加載并展示針對(duì)當(dāng)前視頻內(nèi)容的功能接口 ；所述功能接口包括下載接口、和/或分享接口、和/或收藏接口、和/或調(diào)用第三方視頻播放軟件播放所述視頻內(nèi)容接口中至少一個(gè)。
[0390]A21、如Al所述的方法，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0391]當(dāng)偵聽到針對(duì)視頻元素顯示位置的尺寸變更操作時(shí)，根據(jù)拖拽動(dòng)作修改視頻元素CSS文件中的顯示尺寸。
[0392]A22、如Al所述的方法，在所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示之前，還包括:
[0393]判斷當(dāng)前網(wǎng)頁(yè)中是否存在多個(gè)視頻元素；如果存在，則提示用戶選擇進(jìn)行小窗顯示的播放元素并提供選擇接口 ；對(duì)于用戶未選擇的播放元素，停止判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示。
[0394]A23、如Al所述的方法，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0395]當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，觸發(fā)對(duì)所述視頻元素中播放內(nèi)容的暫停操作；當(dāng)鼠標(biāo)移出所述視頻元素顯示位置后，再繼續(xù)播放所述視頻內(nèi)容。
[0396]A24、如Al所述的方法，在通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示之后，還包括:
[0397]當(dāng)在所述視頻元素的顯示位置偵聽到拖拽動(dòng)作后，將所述視頻元素的顯示位置的位置隨著拖拽動(dòng)作移動(dòng)。
[0398]A25、如A24所述的方法,將所述視頻元素的顯示位置的位置隨著拖拽動(dòng)作移動(dòng)包括:
[0399]在對(duì)應(yīng)所述視頻元素的CSS樣式中，將視頻元素的定位參數(shù)隨著在網(wǎng)頁(yè)視窗區(qū)域內(nèi)拖拽的位置參數(shù)而改變。
[0400]A26、如Al所述的方法，所述由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本，包括:
[0401]在網(wǎng)頁(yè)文檔的〈head〉標(biāo)簽中添加〈script〉標(biāo)簽,通過所述〈script〉標(biāo)簽寫入所述顯示控制腳本。
[0402]本發(fā)明還公開了 B27、一種網(wǎng)頁(yè)中視頻元素的播放裝置，包括:
[0403]網(wǎng)頁(yè)文檔獲取模塊，適于從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔；
[0404]腳本加載模塊，適于判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本；
[0405]顯示位置判斷模塊，適于所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示；
[0406]顯示位置更改模塊，適于通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。
[0407]B28、如B27所述的裝置，所述腳本注入模塊包括:
[0408]網(wǎng)頁(yè)判斷模塊，適于針對(duì)當(dāng)前網(wǎng)頁(yè)文檔對(duì)應(yīng)的網(wǎng)址，根據(jù)以通配符構(gòu)建的網(wǎng)址匹配規(guī)則和/或預(yù)置的網(wǎng)址名單，對(duì)所述網(wǎng)址進(jìn)行匹配；當(dāng)網(wǎng)址匹配上，則判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。
[0409]B29、如B28所述的裝置，所述網(wǎng)頁(yè)判斷模塊包括:
[0410]模板網(wǎng)頁(yè)判斷模塊，適于在網(wǎng)址匹配上之后，提取對(duì)應(yīng)所述網(wǎng)址的網(wǎng)頁(yè)架構(gòu)模板，并利用所述網(wǎng)頁(yè)架構(gòu)模板對(duì)所述網(wǎng)頁(yè)文檔進(jìn)行匹配；當(dāng)所述網(wǎng)頁(yè)文檔與上述網(wǎng)頁(yè)架構(gòu)模板匹配上，則判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。
[0411]B30、如B27所述的裝置，所述顯示位置更改模塊包括:
[0412]元素位置更改模塊，適于修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
[0413]B31、如B30所述的裝置，所述元素位置更改模塊包括:
[0414]第一顯示位置判斷模塊，適于根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示。
[0415]B32、如B31所述的裝置，所述第一顯示位置判斷模塊包括:
[0416]第一滾動(dòng)比例計(jì)算模塊，適于根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0417]第一滾動(dòng)距離獲取模塊，適于獲取所述視頻元素顯示位置中，在視頻元素高度范圍內(nèi)的高度值到顯示視窗頂部的距離閾值L ;
[0418]第一滾動(dòng)閾值確定模塊，適于根據(jù)所述滾動(dòng)比例和距離閾值L確定滾動(dòng)條需要滾動(dòng)的第一閾值；
[0419]第一元素判斷模塊，適于當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第一閾值時(shí)，則判斷所述視頻元素部分顯示或者全部地未被顯示。
[0420]B33、如B31所述的裝置，所述第一顯示位置判斷模塊包括:
[0421]第二滾動(dòng)比例計(jì)算模塊，適于根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0422]第二滾動(dòng)距離獲取模塊，適于獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值A(chǔ) ;
[0423]第二滾動(dòng)閾值確定模塊，適于根據(jù)所述滾動(dòng)比例和距離閾值A(chǔ)確定滾動(dòng)條需要滾動(dòng)的第二閾值；
[0424]部分顯示判斷模塊，適于當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第二閾值時(shí)，則判斷所述視頻元素部分顯示。
[0425]B34、如B31所述的裝置，根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中全部地未被顯示包括:
[0426]第三滾動(dòng)距離獲取模塊，適于根據(jù)網(wǎng)頁(yè)整體大小屬性、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例；
[0427]第三滾動(dòng)距離獲取模塊，適于獲取所述視頻元素顯示位置的底部到顯示視窗頂部的距離閾值B;
[0428]第三滾動(dòng)閾值確定模塊，適于根據(jù)所述滾動(dòng)比例和距離閾值B確定滾動(dòng)條需要滾動(dòng)的第三閾值；
[0429]全部未顯示判斷模塊，適于當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第三閾值時(shí)，則判斷所述視頻元素全部地未被顯示。
[0430]B35、如B33所述的裝置，所述第二滾動(dòng)距離獲取模塊包括:
[0431]第一觸發(fā)計(jì)算模塊，適于在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值A(chǔ)。
[0432]B36、如B34所述的裝置，所述第三滾動(dòng)距離獲取模塊包括:
[0433]第二觸發(fā)計(jì)算模塊，適于在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值B。
[0434]B37、如B33或B34其所述的裝置,所述顯示位置更改模塊之后,還包括:
[0435]還原判斷模塊，適于根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述顯示視窗中是否全部顯示所述視頻元素的初始顯示位置；適于如果是，則將當(dāng)前顯示位置的視頻元素還原至初始顯示位置。
[0436]B38、如B37所述的方法，所述還原判斷模塊包括:
[0437]第一還原判斷模塊，適于當(dāng)視頻元素開始部分顯示后，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述滾動(dòng)條距離所述顯示視窗頂部的距離是否小于所述第二閾值；如果小于所述第二閾值，判斷所述顯示視窗開始全部顯示所述視頻元素的初始顯示位置；
[0438]或者，第二還原判斷模塊，適于當(dāng)視頻元素開始全部地不被顯示后，根據(jù)用戶觸發(fā)的滾動(dòng)條事件，判斷所述滾動(dòng)條距離所述顯示視窗頂部的距離是否小于所述第三閾值；如果小于所述第三閾值，判斷所述顯示視窗開始全部顯示所述視頻元素的初始顯示位置。
[0439]B39、如B37所述的方法，所述還原判斷模塊包括:
[0440]第一還原判斷模塊，適于在網(wǎng)頁(yè)HTML的CSS文件中，將所述視頻元素的CSS樣式的顯示位置修改為在初始的顯示位置，將所述CSS樣式的顯示層索引修改為初始的索引參數(shù)。
[0441]B40、如B30所述的裝置，所述元素位置更改模塊包括:
[0442]第一元素位置更改模塊，適于將所述視頻元素的顯示位置中顯示尺寸進(jìn)行縮放，將所述顯示位置的中定位參數(shù)修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示。
[0443]B41、如B30所述的裝置，所述元素位置更改模塊包括:
[0444]第二元素位置更改模塊，適于在網(wǎng)頁(yè)HTML的CSS文件中，將所述視頻元素的CSS樣式的顯示位置修改為在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中顯示，將所述CSS樣式的顯示層索引修改為頂層的索引參數(shù)。
[0445]B42、如B41所述的裝置，所述第二元素位置更改模塊包括:
[0446]第一相對(duì)修改模塊，適于針對(duì)所述視頻元素的CSS樣式，將所述CSS樣式的顯示位置中的定位參數(shù)相對(duì)滾動(dòng)條位置進(jìn)行修改。
[0447]B43、如B41所述的裝置，所述第二顯示位置更改模塊包括:包括:
[0448]第二相對(duì)修改模塊，適于針對(duì)所述視頻元素的CSS樣式，將所述CSS樣式的顯示位置中的定位參數(shù)相對(duì)顯示視窗位置進(jìn)行修改。
[0449]B44、如B30所述的裝置，所述元素位置更改模塊包括:
[0450]按鈕隱藏模塊，適于將所述視頻元素中的控制按鈕隱藏。
[0451]B45、如B27所述的裝置，在顯示位置更改模塊之后，還包括:
[0452]關(guān)聯(lián)視頻接口提模塊，適于獲取當(dāng)前視頻元素中播放的視頻的關(guān)聯(lián)視頻信息；當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，在視頻元素顯示供所述關(guān)聯(lián)視頻信息并提供點(diǎn)擊接口。
[0453]B46、如B27所述的裝置，在顯示位置更改模塊之后，還包括:
[0454]功能結(jié)構(gòu)提供模塊，適于當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，加載并展示針對(duì)當(dāng)前視頻內(nèi)容的功能接口 ；所述功能接口包括下載接口、和/或分享接口、和/或收藏接口、和/或調(diào)用第三方視頻播放軟件播放所述視頻內(nèi)容接口中至少一個(gè)。
[0455]B47、如B27所述的裝置，在顯示位置更改模塊之后，還包括:
[0456]尺寸改變模塊，適于當(dāng)偵聽到針對(duì)視頻元素顯示位置的尺寸變更操作時(shí)，根據(jù)拖拽動(dòng)作修改視頻元素CSS文件中的顯示尺寸。
[0457]B48、如B27所述的裝置，在顯示位置判斷模塊之前，還包括:
[0458]選擇提示模塊，適于判斷當(dāng)前網(wǎng)頁(yè)中是否存在多個(gè)視頻元素；如果存在，則提示用戶選擇進(jìn)行小窗顯示的播放元素并提供選擇接口 ；對(duì)于用戶未選擇的播放元素，停止判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示。
[0459]B49、如B27所述的裝置，在顯示位置更改模塊之后，還包括:
[0460]暫停模塊，適于當(dāng)偵聽到鼠標(biāo)懸停至所述視頻元素顯示位置時(shí)，觸發(fā)對(duì)所述視頻元素中播放內(nèi)容的暫停操作；當(dāng)鼠標(biāo)移出所述視頻元素顯示位置后，再繼續(xù)播放所述視頻內(nèi)容。
[0461]B50、如B27所述的裝置，在顯示位置更改模塊之后，還包括:
[0462]位置移動(dòng)模塊，適于當(dāng)在所述視頻元素的顯示位置偵聽到拖拽動(dòng)作后，將所述視頻元素的顯示位置的位置隨著拖拽動(dòng)作移動(dòng)。
[0463]B51、如B27所述的裝置，所述位置移動(dòng)模塊包括:
[0464]第一位置移動(dòng)模塊，適于在對(duì)應(yīng)所述視頻元素的CSS樣式中，將視頻元素的定位參數(shù)隨著在網(wǎng)頁(yè)視窗區(qū)域內(nèi)拖拽的位置參數(shù)而改變。
[0465]B52、如B27所述的裝置，所述腳本加載模塊包括:
[0466]腳本注入模塊，適于在網(wǎng)頁(yè)文檔的〈head〉標(biāo)簽中添加〈script〉標(biāo)簽，通過所述〈script〉標(biāo)簽寫入所述顯示控制腳本。
【權(quán)利要求】
1.一種網(wǎng)頁(yè)中視頻元素的播放方法，包括: 從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔； 判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本； 所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示； 通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。
2.如權(quán)利要求1所述的方法，其特征在于，所述判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)包括: 針對(duì)當(dāng)前網(wǎng)頁(yè)文檔對(duì)應(yīng)的網(wǎng)址，根據(jù)以通配符構(gòu)建的網(wǎng)址匹配規(guī)則和/或預(yù)置的網(wǎng)址名單，對(duì)所述網(wǎng)址進(jìn)行匹配；當(dāng)網(wǎng)址匹配上，則判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。
3.如權(quán)利要求2所述的方法，其特征在于，在網(wǎng)址匹配上之后，包括: 提取對(duì)應(yīng)所述網(wǎng)址的網(wǎng)頁(yè)架構(gòu)模板，并利用所述網(wǎng)頁(yè)架構(gòu)模板對(duì)所述網(wǎng)頁(yè)文檔進(jìn)行匹配；當(dāng)所述網(wǎng)頁(yè)文檔與上述網(wǎng)頁(yè)架構(gòu)模板匹配上，則判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)。
4.如權(quán)利要求1所述的方法，其特征在于，所述將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示包括: 修改所述視頻元素的顯示位置和顯示層索引，使所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中被置頂顯示。
5.如權(quán)利要求4所述的方法，其特征在于，所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示或者全部地未被顯示，包括: 根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示。
6.如權(quán)利要求5所述的方法，其特征在于，根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示包括: 根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例； 獲取所述視頻元素顯示位置中，在視頻元素高度范圍內(nèi)的高度值到顯示視窗頂部的距離閾值L; 根據(jù)所述滾動(dòng)比例和距離閾值L確定滾動(dòng)條需要滾動(dòng)的第一閾值； 當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第一閾值時(shí)，則判斷所述視頻元素部分顯示或者全部地未被顯示。
7.如權(quán)利要求5所述的方法，其特征在于，根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小屬性，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示包括: 根據(jù)網(wǎng)頁(yè)整體大小、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例； 獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值A(chǔ) ; 根據(jù)所述滾動(dòng)比例和距離閾值A(chǔ)確定滾動(dòng)條需要滾動(dòng)的第二閾值； 當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第二閾值時(shí)，則判斷所述視頻元素部分顯示。
8.如權(quán)利要求5所述的方法，其特征在于，根據(jù)視頻元素的顯示位置、顯示視窗的顯示位置、滾動(dòng)條的顯示位置、頁(yè)面整體的大小，判斷所述視頻元素在當(dāng)前瀏覽器顯示視窗中全部地未被顯示包括: 根據(jù)網(wǎng)頁(yè)整體大小屬性、滾動(dòng)條的顯示位置以及網(wǎng)頁(yè)當(dāng)前瀏覽器顯示視窗的顯示位置，確定滾動(dòng)條的滾動(dòng)距離與網(wǎng)頁(yè)的滾動(dòng)距離之間的滾動(dòng)比例； 獲取所述視頻元素顯示位置的底部到顯示視窗頂部的距離閾值B ； 根據(jù)所述滾動(dòng)比例和距離閾值B確定滾動(dòng)條需要滾動(dòng)的第三閾值； 當(dāng)滾動(dòng)條滾動(dòng)的距離C達(dá)到第三閾值時(shí)，則判斷所述視頻元素全部地未被顯示。
9.如權(quán)利要求7所述的方法，其特征在于，獲取所述視頻元素顯示位置的頂部到顯示視窗頂部的距離閾值A(chǔ)包括: 在網(wǎng)頁(yè)加載完成之后，用戶初次觸發(fā)滾動(dòng)條事件時(shí)，計(jì)算所述距離閾值A(chǔ)。
10.一種網(wǎng)頁(yè)中視頻元素的播放裝置，包括: 網(wǎng)頁(yè)文檔獲取模塊，適于從網(wǎng)頁(yè)服務(wù)器側(cè)獲取到用于加載的網(wǎng)頁(yè)文檔； 腳本加載模塊，適于判斷出所述網(wǎng)頁(yè)文檔為帶有可播放的視頻元素的特定網(wǎng)頁(yè)，由瀏覽器向所述網(wǎng)頁(yè)文檔中注入用于對(duì)所述視頻元素進(jìn)行顯示控制的顯示控制腳本； 顯示位置判斷模塊，適于所述顯示控制腳本判斷出所述視頻元素在當(dāng)前瀏覽器顯示視窗中部分顯示和/或者全部地未被顯示； 顯示位置更改模塊，適于通過所述顯示控制腳本將所述視頻元素在當(dāng)前瀏覽器顯示視窗中的當(dāng)前網(wǎng)頁(yè)中進(jìn)行獨(dú)立顯示。
【文檔編號(hào)】G06F17/30GK104268252SQ201410523188
【公開日】2015年1月7日 申請(qǐng)日期:2014年9月30日 優(yōu)先權(quán)日:2014年9月30日
【發(fā)明者】高慶光 申請(qǐng)人:北京奇虎科技有限公司, 奇智軟件（北京）有限公司