html5標籤video 筆記二

摘要

獲取影片總時長

音量的獲取和設定

第一、獲取影片總時長

<
videoid=
"myvideo"
controls
preload
="auto"
width
=300
height
="165"
poster
=""src=
"">
video
>

設定乙個id後，那麼就可以開始操作了，要獲取總時長，要用到video的乙個事件-loadedmetadata，這個事件的觸發表示元資料（**的一些基本資訊）已經載入完成，用addeventlistener監聽事件

var myvideo = document.getelementbyid('myvideo');//獲取video元素
myvideo.addeventlistener("loadedmetadata", function()
);

好了，已經監聽了，那麼接下來要做的就是獲取總時長，其實就是乙個屬性-duration

var myvideo = document.getelementbyid('myvideo')//獲取video元素
,tol = 0
;myvideo.addeventlistener("loadedmetadata", function()
);

需要注意的是獲取到的在總時長的單位為秒，顯示的時候根據需要去轉換。

var myvideo = document.getelementbyid('myvideo')//獲取video元素
,tol = 0
;myvideo.addeventlistener("loadedmetadata", function()
);function
play()
//暫停
function
pause()

myvideo.addeventlistener("timeupdate", function()

);執行後會在控制台看到很多資料...

function

playbyseconds

(num)

第四、音量的獲取和設定

//音量改變時
myvideo.addeventlistener("volumechange", function()
);

當你通過控制條來改變音量時，你會看到除錯裡面有很多資料。要注意的是音量的範圍值為0~1，一般在ui中都是用百分比，所以需要的時候要進行轉換。

//設定音量
function
setvol
(num)

下面是完整的**：

)//獲取video元素

,tol =

0//總時長

;myvideo.addeventlistener(

"loadedmetadata"

, function()

);function

play()

//暫停

function

pause()

myvideo.addeventlistener(

"timeupdate"

, function()

);function

playbyseconds

(num

)//音量改變時

myvideo.addeventlistener(

"volumechange"

, function()

);//設定音量

function

setvol

(num

)script

body

html

html5標籤video 筆記一

摘要網上的教程其實也不少了 w3cschool裡面的最為簡單而詳細，那麼這幾介紹的是一些更為直接的應用。本文目錄使用標籤加上一些必要引數第一步使用標籤使用的方法很簡單，就是一句 video video video controls src video video controls aut...

學習html5的video標籤

慣例我是溫浩然您的瀏覽器不支援 video 標籤。親自試一試 iefirefox chrome safari opera internet explorer 9 firefox,opera,chrome 以及 safari 支援標籤。注釋 internet explorer 8 以及更早的版本...

HTML5的學習（二）HTML5標籤

3.按功能排列標籤標籤描述 html4 html5 定義注釋。定義文件型別。定義文件的主體。定義文件中的節。定義section或page的頁尾。to定義html標題。定義html文件。定義關於文件的資訊。定義section或page的頁首。定義關於html文件的元資訊。定義針對不支援客戶端指令碼...

html5標籤video 筆記二

html5標籤video 筆記一

學習html5的video標籤

HTML5的學習（二）HTML5標籤

相關推薦