資訊專欄INFORMATION COLUMN
摘要：安卓端下的標(biāo)簽播放時(shí)會(huì)被瀏覽器接管。安卓下的內(nèi)核瀏覽器，提供了相關(guān)屬性。以下內(nèi)容范圍安卓在未被播放之前，標(biāo)簽屬于正常文檔元素，也是生效的。標(biāo)簽播放中和播放之后均會(huì)覆蓋。刪除標(biāo)簽，瀏覽器的視頻播放組件會(huì)立即消失，時(shí)間大幅度縮短。
1.安卓端下的video標(biāo)簽播放時(shí)會(huì)被瀏覽器接管。此時(shí)已經(jīng)脫離了文檔流，并且與文檔已經(jīng)非同層了，所以設(shè)置z-index是無(wú)效的。
2.安卓下qq的x5內(nèi)核瀏覽器，提供了相關(guān)屬性。分別為：x5-playsinline：行內(nèi)播放。x5-video-player-type="h5"：播放層級(jí)為文檔層級(jí)。如果頁(yè)面只有一個(gè)視頻而且該視頻在頁(yè)面的頂部用起來(lái)還是比較順心的。否則會(huì)發(fā)現(xiàn)，額。。。播放視頻的時(shí)候會(huì)紊亂的。
所以移動(dòng)端中，不建議做視頻和dom重合的設(shè)計(jì)。
如果一定要做，請(qǐng)繼續(xù)閱讀。
以下內(nèi)容范圍：安卓
1.在video未被播放之前，video標(biāo)簽屬于正常文檔元素，z-index也是生效的。此時(shí)層級(jí)高的dom可以展示在video標(biāo)簽區(qū)域上方。
2.video標(biāo)簽播放中和播放之后均會(huì)覆蓋dom。
3.瀏覽器同時(shí)只能播放一個(gè)video標(biāo)簽。當(dāng)切換播放視頻內(nèi)容時(shí)體驗(yàn)不是很好：
瀏覽器播放組件切換視頻時(shí)花費(fèi)的時(shí)間可以明顯的感知的到。
瀏覽器播放組件的底色一般是黑色，而我們的web底色大多時(shí)候不是黑色，切換時(shí)，會(huì)出現(xiàn)閃動(dòng)。是由于瀏覽器播放組件的關(guān)閉然后再次打開造成的。
解決思路：
1.刪除和添加video標(biāo)簽這一節(jié)點(diǎn)，這樣做會(huì)讓video標(biāo)簽恢復(fù)到1中的狀態(tài)。
2.刪除video標(biāo)簽，瀏覽器的視頻播放組件會(huì)立即消失，時(shí)間大幅度縮短。
比如：
我們要解決彈窗被視頻遮擋的問(wèn)題，此時(shí)我們可以將視頻這一節(jié)點(diǎn)刷新（刪除后再次添加）
我們想要切換視頻，就先把當(dāng)前正在播放的視頻刷新，然后播放下一個(gè)視頻。
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/102272.html
摘要：安卓端下的標(biāo)簽播放時(shí)會(huì)被瀏覽器接管。安卓下的內(nèi)核瀏覽器，提供了相關(guān)屬性。以下內(nèi)容范圍安卓在未被播放之前，標(biāo)簽屬于正常文檔元素，也是生效的。標(biāo)簽播放中和播放之后均會(huì)覆蓋。刪除標(biāo)簽，瀏覽器的視頻播放組件會(huì)立即消失，時(shí)間大幅度縮短。 1.安卓端下的video標(biāo)簽播放時(shí)會(huì)被瀏覽器接管。此時(shí)已經(jīng)脫離了文檔流，并且與文檔已經(jīng)非同層了，所以設(shè)置z-index是無(wú)效的。2.安卓下qq的x5內(nèi)核瀏覽器，...
摘要：初入前端，若有不足歡迎指正頭部初始化標(biāo)簽問(wèn)題一般要添加背景音樂的話，我們的第一反應(yīng)就是使用標(biāo)簽，但是這里有一個(gè)坑。 前言 當(dāng)下移動(dòng)端橫行，平常我們做一些移動(dòng)端的項(xiàng)目，接觸最多的就是H5，雖然做移動(dòng)端不用兼容IE，但是 我們要兼容微信、app、ios、android... 今天就給寫幾個(gè)平常開發(fā)經(jīng)常會(huì)遇到的問(wèn)題以及解決辦法。 初入前端，若有不足 歡迎指正！ 頭部初始化 ...
摘要：初入前端，若有不足歡迎指正頭部初始化標(biāo)簽問(wèn)題一般要添加背景音樂的話，我們的第一反應(yīng)就是使用標(biāo)簽，但是這里有一個(gè)坑。 前言 當(dāng)下移動(dòng)端橫行，平常我們做一些移動(dòng)端的項(xiàng)目，接觸最多的就是H5，雖然做移動(dòng)端不用兼容IE，但是 我們要兼容微信、app、ios、android... 今天就給寫幾個(gè)平常開發(fā)經(jīng)常會(huì)遇到的問(wèn)題以及解決辦法。 初入前端，若有不足 歡迎指正！ 頭部初始化 ...
閱讀 3597·2023-04-26 01:43
閱讀 2984·2021-10-14 09:42
閱讀 5477·2021-09-30 09:59
閱讀 2183·2021-09-04 16:40
閱讀 1220·2019-08-30 15:52
閱讀 838·2019-08-29 17:09
閱讀 2006·2019-08-26 13:37
閱讀 3440·2019-08-26 10:20
