摘要:需求背景最新在忙一個(gè)需求,就是小程序的課程詳情的展示視頻,如下圖層級(jí)過(guò)高在小程序的官方文檔的話是有介紹的目前解決的方案使用標(biāo)簽可以覆蓋到原生組件中。
需求背景:最新在忙一個(gè)需求,就是小程序的課程詳情的展示視頻,如下圖
video層級(jí)過(guò)高
在小程序的官方文檔的話是有介紹的
目前解決的方案
使用【cover-view】【cover-image】標(biāo)簽可以覆蓋到原生組件中。
視頻方面的話是頂置在頁(yè)面的最頂部,以視頻層級(jí)為最高
video視頻定位問(wèn)題
詳細(xì)說(shuō)明:小程序的視頻支持定位,但是在一部分手機(jī)上【不區(qū)分安卓和IOS】定位會(huì)造成視頻底部黑底,如下圖
目前的嘗試過(guò)的方案:
視頻展示的時(shí)候彈遮罩層,整體頁(yè)面overflow: hidden;底部的遮罩層使用fixed定位,保證IOS彈性滑動(dòng)的時(shí)候看不到底部的樣式,
點(diǎn)擊視頻的時(shí)候跳轉(zhuǎn)新的頁(yè)面,在新的頁(yè)面中展示視頻,
網(wǎng)上還有一些關(guān)于視頻定位問(wèn)題的解決方案還未考究
視頻關(guān)閉的時(shí)候會(huì)有聲音
詳細(xì)說(shuō)明:一個(gè)頁(yè)面使用圖片點(diǎn)擊的時(shí)候展示視頻,捕獲視頻的縮放和回退的時(shí)候隱藏視頻,但是一部分的安卓手機(jī)還是能播放聲音
目前不能解決、嘗試的解決方案
等視頻隱藏的時(shí)候,增加一個(gè)狀態(tài)值,在watch的時(shí)候【ps:wepy框架為例】檢測(cè)值的變化,手動(dòng)觸發(fā)暫停,或者停止,但是似乎都沒(méi)有理想的狀態(tài),還是存在問(wèn)題
通過(guò)狀態(tài)值,清空video標(biāo)簽的src,但是會(huì)造成一部分手機(jī)加載不出視頻的bug,初步認(rèn)定是請(qǐng)求的延遲導(dǎo)致
其他可能遇到的問(wèn)題
參考資料:
http://www.wxapp-union.com/th...
https://www.cnblogs.com/i-dou...
PS:關(guān)于小程序?qū)蛹?jí)的問(wèn)題,其實(shí)在愛(ài)奇藝、騰訊視頻等小程序都是能實(shí)現(xiàn)的。希望有人看到這篇文章的時(shí)候能給與更好的解決方案
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/99746.html
摘要:微信小程序仿今日美食初學(xué)微信小程序,嗯,還不錯(cuò)嘛,挺有趣的于是自己動(dòng)手?jǐn)]了一個(gè)。開(kāi)發(fā)工具下載開(kāi)發(fā)者工具微信小程序官網(wǎng),下載好后就可以進(jìn)行開(kāi)發(fā)了喲。 wechat-todayFood 微信小程序仿今日美食food 初學(xué)微信小程序,嗯,還不錯(cuò)嘛,挺有趣的! 于是自己動(dòng)手?jǐn)]了一個(gè)?。你別說(shuō)一看標(biāo)題就知道我是吃貨呀,我是不想這么快就被揭穿的,但是這個(gè)小程序就是這么有意思呀。好了我要進(jìn)入正題了,...
摘要:微信小程序仿今日美食初學(xué)微信小程序,嗯,還不錯(cuò)嘛,挺有趣的于是自己動(dòng)手?jǐn)]了一個(gè)。開(kāi)發(fā)工具下載開(kāi)發(fā)者工具微信小程序官網(wǎng),下載好后就可以進(jìn)行開(kāi)發(fā)了喲。 wechat-todayFood 微信小程序仿今日美食food 初學(xué)微信小程序,嗯,還不錯(cuò)嘛,挺有趣的! 于是自己動(dòng)手?jǐn)]了一個(gè)?。你別說(shuō)一看標(biāo)題就知道我是吃貨呀,我是不想這么快就被揭穿的,但是這個(gè)小程序就是這么有意思呀。好了我要進(jìn)入正題了,...
摘要:封裝手寫的方筆記使用檢測(cè)文件前端掘金副標(biāo)題可以做什么以及使用中會(huì)遇到的坑。目的是幫助人們用純中文指南實(shí)現(xiàn)復(fù)選框中多選功能前端掘金作者緝熙簡(jiǎn)介是推出的一個(gè)天挑戰(zhàn)。 深入理解 JavaScript Errors 和 Stack Traces - 前端 - 掘金譯者注:本文作者是著名 JavaScript BDD 測(cè)試框架 Chai.js 源碼貢獻(xiàn)者之一,Chai.js 中會(huì)遇到很多異常處理...
閱讀 711·2021-11-18 10:07
閱讀 2909·2021-09-22 16:04
閱讀 908·2021-08-16 10:50
閱讀 3403·2019-08-30 15:56
閱讀 1810·2019-08-29 13:22
閱讀 2868·2019-08-26 17:15
閱讀 1304·2019-08-26 10:57
閱讀 1136·2019-08-23 15:23