資訊專欄INFORMATION COLUMN
摘要：本文基于，自定義視頻播放器樣式。有的瀏覽器就是不支持，白名單都沒有。來個，打開為移動端模式，的事件是支持的，只是樣式需要自個兒來。
DIY
本文基于HTML5 Video API，自定義Web視頻播放器樣式。
其實吧，原生的video 標簽樣式挺好看的，但每個人的視覺感受不一樣，所以就會有需要改變原生樣式的時候。
那就給它化個妝咯。淡妝，淡妝。
【code here】
添加playsinline屬性：
webkit-playsinline="true" playsinline="true" x5-playsinline
這個playsinline屬性是讓video內(nèi)斂到瀏覽器webview里面，而不使用瀏覽器自己實現(xiàn)的video樣式，但是有的瀏覽器不認這個，就是強制要用自己的。比如UC，你要用的話就需要它給你配置白名單。有的瀏覽器就是不支持，白名單都沒有。
關(guān)于騰訊的x5等瀏覽器的這些屬性可以看他們的文章【騰訊瀏覽服務(wù)-H5同層播放器接入規(guī)范】
資料Video/Audio
HTML/Element/video
Media_events
Use$(selector).initVideoPlayer(); // select 為video元素
播放器樣式在git code項目的demo文件夾有多帶帶的css，可根據(jù)需要改成自己喜歡的樣子，或者你產(chǎn)品經(jīng)理喜歡的樣子。
DEMO來個demo，PC 打開為移動端模式，PC的事件是支持的，只是樣式需要自個兒來。
手機掃描二維碼：
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/97728.html
摘要：本文基于，自定義視頻播放器樣式。有的瀏覽器就是不支持，白名單都沒有。來個，打開為移動端模式，的事件是支持的，只是樣式需要自個兒來。 DIY 本文基于HTML5 Video API，自定義Web視頻播放器樣式。 其實吧，原生的video 標簽樣式挺好看的，但每個人的視覺感受不一樣，所以就會有需要改變原生樣式的時候。 那就給它化個妝咯。淡妝，淡妝。 【code here】 添加play...
摘要：自定義視頻播放器微信公眾號開發(fā)企業(yè)級產(chǎn)品全棧開發(fā)速成周末班首期班號正式開班，歡迎搶座作者簡介是推出的一個天挑戰(zhàn)。 Day11 - 自定義視頻播放器 (Node+Vue+微信公眾號開發(fā))企業(yè)級產(chǎn)品全棧開發(fā)速成周末班首期班(10.28號正式開班，歡迎搶座) 作者：?liyuechun 簡介：JavaScript30 是 Wes Bos 推出的一個 30 天挑戰(zhàn)。項目免費提供了 30 個視...
閱讀 2531·2021-09-24 10:29
閱讀 3814·2021-09-22 15:46
閱讀 2582·2021-09-04 16:41
閱讀 2987·2019-08-30 15:53
閱讀 1268·2019-08-30 14:24
閱讀 3062·2019-08-30 13:19
閱讀 2177·2019-08-29 14:17
閱讀 3527·2019-08-29 12:55
