Sunday, February 22, 2015

Belajar Elemen Video HTML5

Dari artikel yang saya jelaskan sebelumnya, mungkin anda sudah sedikit mengerti tentang html5 kan? Nah, untuk kali ini langsung saja kita akan membahas struktur elemennya. Yang pertama kali akan saya bahas adalah video html5.
Buat kamu yang baru masuk ke sini, coba pelajari dulu tutorial tentang belajar HTML5  dan Belajar Elemen HTML5 ini.
Video html5 elemen diperkenalkan dalam spesifikasi rancangan HTML5 dengan tujuan memutar video atau film. Sebagian fungsinya adalah menggantikan elemen objek (yang isinya skrip yang rumit). Video HTML5 dimaksudkan untuk menjadi standar baru dalam menampilkan video di web tanpa plugin. Intinya sih supaya lebih cepat loading ketimbang harus dengan plugin flash atau yang lain.
Standar HTML5 mencakup banyak fitur baru untuk aplikasi web dan antarmuka yang lebih dinamis. Salah satu komponen seperti disebut di atas yakni <video>. Dengan menggunakan Javascript HTML5 video kita dapat diputar pada perangkat-perangkat mobile terbaru dan bahkan di browser lama tanpa Flash. Youtube juga telah mencoba fitur baru ini tapi masih dalam taraf percobaan.
Untuk menampilkan video menggunakan html5, perhatikan script HTML5 berikut ini :
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE HTML>
 
<html>
 
<body>
 
<video width="320" height="240" controls="controls">
 
<source src="movie.mp4" type="video/mp4" />
 
<source src="movie.ogg" type="video/ogg" />
 
Your browser does not support the video tag.
 
</video>
 
</body>
 
</html>

Keterangan :
Atribut kontrol menambahkan kontrol video, seperti play, pause, dan volume.
Sebagaimana kamu lihat, kita juga bisa menyertakan atribut lebar dan tingginya. Jika tinggi dan lebar diatur, ruang yang diperlukan untuk video akan dibatalkan pada saat halaman dibuka. Namun, tanpa atribut-atribut ini, browser tidak mengetahui ukuran video, dan tidak dapat memesan ruang yang sesuai untuk itu. Efeknya bahwa tata letak halaman akan berubah selama pembebanan (saat video sedang dimuat).

Anda juga harus memasukkan konten teks antara <video> dan </ video> tag untuk browser yang tidak mendukung elemen <video>.
Try This: 4 Langkah Mudah Belajar Cara Membuat Website, Langsung Praktek! KLIK DI SINI!.

Unsur <video> memungkinkan beberapa elemen <source>. elemen <source> dapat link ke file video yang berbeda. Browser akan menggunakan format diakui pertama

0 comments:

Post a Comment

 

© Copyright 2010 oleh HariZ| Powered By : Blogger