成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

安卓移動端video標(biāo)簽將頁面元素覆蓋。

LinkedME2016 / 3485人閱讀

摘要:安卓端下的標(biāo)簽播放時會被瀏覽器接管。安卓下的內(nèi)核瀏覽器,提供了相關(guān)屬性。以下內(nèi)容范圍安卓在未被播放之前,標(biāo)簽屬于正常文檔元素,也是生效的。標(biāo)簽播放中和播放之后均會覆蓋。刪除標(biāo)簽,瀏覽器的視頻播放組件會立即消失,時間大幅度縮短。

1.安卓端下的video標(biāo)簽播放時會被瀏覽器接管。此時已經(jīng)脫離了文檔流,并且與文檔已經(jīng)非同層了,所以設(shè)置z-index是無效的。
2.安卓下qq的x5內(nèi)核瀏覽器,提供了相關(guān)屬性。分別為:x5-playsinline:行內(nèi)播放。x5-video-player-type="h5":播放層級為文檔層級。如果頁面只有一個視頻而且該視頻在頁面的頂部用起來還是比較順心的。否則會發(fā)現(xiàn),額。。。播放視頻的時候會紊亂的。
所以移動端中,不建議做視頻和dom重合的設(shè)計。
如果一定要做,請繼續(xù)閱讀。
以下內(nèi)容范圍:安卓
1.在video未被播放之前,video標(biāo)簽屬于正常文檔元素,z-index也是生效的。此時層級高的dom可以展示在video標(biāo)簽區(qū)域上方。
2.video標(biāo)簽播放中和播放之后均會覆蓋dom。
3.瀏覽器同時只能播放一個video標(biāo)簽。當(dāng)切換播放視頻內(nèi)容時體驗不是很好:

瀏覽器播放組件切換視頻時花費的時間可以明顯的感知的到。

瀏覽器播放組件的底色一般是黑色,而我們的web底色大多時候不是黑色,切換時,會出現(xiàn)閃動。是由于瀏覽器播放組件的關(guān)閉然后再次打開造成的。

解決思路:
1.刪除和添加video標(biāo)簽這一節(jié)點,這樣做會讓video標(biāo)簽恢復(fù)到1中的狀態(tài)。
2.刪除video標(biāo)簽,瀏覽器的視頻播放組件會立即消失,時間大幅度縮短。
比如:

我們要解決彈窗被視頻遮擋的問題,此時我們可以將視頻這一節(jié)點刷新(刪除后再次添加)

我們想要切換視頻,就先把當(dāng)前正在播放的視頻刷新,然后播放下一個視頻。

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/117459.html

相關(guān)文章

  • 安卓移動video標(biāo)簽頁面元素覆蓋

    摘要:安卓端下的標(biāo)簽播放時會被瀏覽器接管。安卓下的內(nèi)核瀏覽器,提供了相關(guān)屬性。以下內(nèi)容范圍安卓在未被播放之前,標(biāo)簽屬于正常文檔元素,也是生效的。標(biāo)簽播放中和播放之后均會覆蓋。刪除標(biāo)簽,瀏覽器的視頻播放組件會立即消失,時間大幅度縮短。 1.安卓端下的video標(biāo)簽播放時會被瀏覽器接管。此時已經(jīng)脫離了文檔流,并且與文檔已經(jīng)非同層了,所以設(shè)置z-index是無效的。2.安卓下qq的x5內(nèi)核瀏覽器,...

    iamyoung001 評論0 收藏0
  • css前初始化

    摘要:初入前端,若有不足歡迎指正頭部初始化標(biāo)簽問題一般要添加背景音樂的話,我們的第一反應(yīng)就是使用標(biāo)簽,但是這里有一個坑。 前言 當(dāng)下移動端橫行,平常我們做一些移動端的項目,接觸最多的就是H5,雖然做移動端不用兼容IE,但是 我們要兼容微信、app、ios、android... 今天就給寫幾個平常開發(fā)經(jīng)常會遇到的問題以及解決辦法。 初入前端,若有不足 歡迎指正! 頭部初始化 ...

    mikyou 評論0 收藏0
  • css前初始化

    摘要:初入前端,若有不足歡迎指正頭部初始化標(biāo)簽問題一般要添加背景音樂的話,我們的第一反應(yīng)就是使用標(biāo)簽,但是這里有一個坑。 前言 當(dāng)下移動端橫行,平常我們做一些移動端的項目,接觸最多的就是H5,雖然做移動端不用兼容IE,但是 我們要兼容微信、app、ios、android... 今天就給寫幾個平常開發(fā)經(jīng)常會遇到的問題以及解決辦法。 初入前端,若有不足 歡迎指正! 頭部初始化 ...

    寵來也 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<