video 是html5新增的方法，關於其他的相信大家也很清楚了！好了廢話不多說
以下是我遇到的一些的方法……
以下是一些屬性
.volume 音量的大小……
html
="box"
>
="video-left"
>
"./movies/movie01.mp4"
>
<
/video>
<
!-- 下面的控制器 --
>
="controls"
>
="play fa fa-play"
>
<
/i>
="full fa fa-arrows-alt"
>
<
/i>
<
!-- 滑塊的值 0
-100
-->
="range-play" type=
"range" value=
"0">
="volume fa fa-volume-up"
>
="range-volume" type=
"range" value=
"100"
>
<
/i>
<
/div>
<
/div>
="video-right"
>
灰姑娘<
/li>
兔子哥<
/li>
報告老闆<
/li>
輕鬆時刻<
/li>
<
/ul>
<
/div>
<
/div>css
.box
/*----------- 左側布局 ---------------*/
.video-left
.video-left video
.video-left .controls
.video-left .play,
.video-left .full,
.video-left .volume
.video-left .range-play
.video-left i
.video-left .volume
.video-left .volume:hover .range-volume
.video-left .range-volume
/*----------- 右側布局 ---------------*/
.video-right
.video-right ul
.video-right li
play.
addeventlistener
("click"
,function()
else})
;
full.
addeventlistener
("click"
,function()
// 相容谷歌
else
if( video.webkitrequestfullscreen )
// 相容火狐
else
if( video.mozrequestfullscreen )
})
video.
addeventlistener
("timeupdate"
,function()
);rangeplay.
addeventlistener
("change"
,function()
);
rangevolume.
addeventlistener
("change"
,function()
else
})
補充解決方案
可以用touchstart 事件觸發，在頂部設乙個透明層，讓使用者一進入就觸發，觸發之後就隱藏那個層。
embed標籤和video的使用
屬性 值 描述 autoplay 屬性 autoplay autoplay controls 屬性 controls controls height 屬性 height pixels loop 屬性 loop loop muted 屬性 muted muted poster 屬性 poster ur...
設定video標籤的預設樣式
使用chrome除錯，如下圖，在setting裡勾選框中選項 可以看到video標籤的控制欄dom結構，如下圖，修改對應的樣式即可 全屏按鈕 video webkit media controls fullscreen button video webkit media controls play ...
完美解決video標籤控制項的隱藏與使用
1.我自己的需求是只保留進度條 需求 未處理 處理後 解決方案2 直接css隱藏部分控制項，試了一下可行，完美解決 隱藏viedo 三個點 this.refs.video disablepictureinpicture true 隱藏video 音量按鈕 video webkit media con...