- 兼容性差
- 因?yàn)槭窃M件
- 層級(jí)最高
- iOS系統(tǒng) 和 安卓系統(tǒng)展示方式不一樣
整理了一些有效的方法
關(guān)于 標(biāo)簽的 css 樣式
//全屏按鈕
video::-webkit-media-controls-fullscreen-button {
display: none;
}
//播放按鈕
video::-webkit-media-controls-play-button {
display: none;
}
//進(jìn)度條
video::-webkit-media-controls-timeline {
display: none;
}
//觀看的當(dāng)前時(shí)間
video::-webkit-media-controls-current-time-display{
display: none;
}
//剩余時(shí)間
video::-webkit-media-controls-time-remaining-display {
display: none;
}
//音量按鈕
video::-webkit-media-controls-mute-button {
display: none;
}
video::-webkit-media-controls-toggle-closed-captions-button {
display: none;
}
//音量的控制條
video::-webkit-media-controls-volume-slider {
display: none;
}
//所有控件
video::-webkit-media-controls-enclosure{
display: none;
}
禁止ios自動(dòng)全屏屬性
<video webkit-playsinline="true" playsinline="true"></video>
// 不希望用戶來拖動(dòng)進(jìn)度條的話,可以直接使用 playsinline屬性,webkit-playsinline屬性
// 注:iPhone Safari 中播放視頻只能全屏
來做補(bǔ)充,有的朋友問到 為什么我加了 autoplay 屬性有的手機(jī)不能自動(dòng)播放代兵,而加了 muted 屬性之后就可以了尼酿,那極有可能是因?yàn)?權(quán)限問題, 從設(shè)置中開通瀏覽器的音頻權(quán)限植影,點(diǎn)擊允許就OK了裳擎。 如果單個(gè)網(wǎng)址打不開權(quán)限,那就直接設(shè)置允許全部的網(wǎng)址自動(dòng)播放音頻思币。 這可能就是為什么muted能讓實(shí)現(xiàn)autoplay的原因