Lompat ke konten Lompat ke sidebar Lompat ke footer

Mendapatkan Nilai Durasi Video HTML Properti Duration DOM

Properti Video duration DOM pada HTML merupakan properti yang digunakan untuk mengembalikan nilai length dari video. Properti Video duration DOM HTML merupakan properti yang mengembalikan nilai dalam satuan detik. Jika properti Video duration digunakan pada browser yang berbeda, maka akan mengembalikan nilai presisi yang berbeda pula, seperti penggunaan browser Safari yang dapat mengembalikan nilai sampai 14 angka desimal, namun pada browser lain seperti Opera hanya dapat mengembalikan nilai sebanyak 9 desimal. 

Mendapatkan Nilai Durasi Video HTML Menggunakan Properti Duration DOM
Properti Duration DOM pada HTML

Sebelum memahami lebih dalam materi tentang Mendapatkan Nilai Durasi Video HTML Properti Duration DOM, terlebih dahulu pelajari materi tentang: Mengatur Kecepatan Playback Video HTML defaultPlaybackRate DOM [klik], Mengatur Muted Video HTML Menggunakan defaultMuted DOM [klik], dan Mengatur Playback HTML Video Menggunakan Properti currentTime DOM [klik].

Properti Video duration adalah properti yang bersifat read-only. Fungsi Video duration akan mengembalikan nilai "NaN" jika tidak terdapat video apapun yang diatur pada video, dimana tidak akan ada nilai length yang akan dikembalikan pada browser, melainkan hanya akan mengembalikan nilai "Inf" (Infinity).

Sintak:
videoObject.duration

Baca Juga:

Berikut adalah ilustrasi program dari penggunaan properti Video duration.

Contoh: mendapatkan nilai length dari video.

<!DOCTYPE html>

<html>

 

<head>

 

<title>

Properti Video duration DOM 

HTML

</title>

 

<style>

h1 

{

color: green;

}

 

h2 

{

font-family: Impact;

}

 

body 

{

text-align: center;

}

</style>

 

</head>

 

<body>

 

<h1>

Blog Elfan

</h1>

 

<h2>

Properti Video Duration

</h2>

 

<br>

 

<video 

id="Test_Video"

width="360"

height="240"

controls>

 

<source 

src="samplevideo.mp4"

type="video/mp4">

 

<source 

src="movie.ogg"

type="video/ogg">

 

</video>

 

<p>

Untuk mengembalikan nilai 

length dari video, lakukan 

double klik pada tombol 

"Return Length".

</p>

 

<button 

ondblclick="My_Video()"

type="button">

Return length

</button>

 

<p id="test"></p>

 

<script>

function My_Video() 

{

var v =

document.getElementById(

"Test_Video").duration;

 

document.getElementById(

"test").innerHTML = v;

}

</script>

 

</body>

 

</html>


Referensi Tambahan:
Artikel ini didedikasikan kepada: Yanwar Widiyanto, Yolanda Khoirunnisa Nabilah, Yoseph Ardianto, Yuliana Pratiwi, dan Yuni Fadlilah.

5 komentar untuk "Mendapatkan Nilai Durasi Video HTML Properti Duration DOM"

  1. Jenis browser apa saja yang dapat digunakan oleh Cima Cimi Slami untuk mengaktifkan properti video duration DOM pada HTML?

    BalasHapus
    Balasan
    1. Berikut adalah beberapa jenis browser yang dapat digunakan oleh Cima Cimi Slami untuk mengaktifkan properti video duration DOM pada HTML:
      1. Google Chrome
      2. Internet Explorer
      3. Firefox
      4. Opera
      5. Apple Safari

      Hapus
  2. Apa yang dimaksud dengan properti duration DOM pada HTML?

    BalasHapus
    Balasan
    1. Properti duration atau properti durasi merupakan properti yang digunakan untuk mengembalikan nilai durasi video, dalam hitungan detik.

      Hapus
    2. Penggunana nilai properti duration pada jenis browser yang berbeda akan mengembalikan nilai yang berbeda pula. Contoh, pada browser Internet Explorer, Firefox, dan Chrome akan mengembalikan nilai sebesar 12.612, pada browser Safari akan mengembalikan nilai sebesar "12.612000465393066", pada browser Opera akan mengembalikan nilai sebesar "12.585215419", sedangkan ada browser Opera 18 akan mengembalikan nilai sebesar "12.62069".

      Hapus

Hubungi admin melalui Wa : +62-896-2414-6106

Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung.

Bantu admin meningkatkan kualitas blog dengan melaporkan berbagai permasalahan seperti typo, link bermasalah, dan lain sebagainya melalui kolom komentar.

- Ikatlah Ilmu dengan Memostingkannya -
- Big things start from small things -