Mempelajari HTML5 dari tingkat dasar part 3

16 June 2018 585

Pada part ini akan membahas tentang HTML5 multimedia yang berkaitan dengan file media, seperti video maupun audio. Tidak seperti pada html sebelumnya, html5 ini lebih mempermudah untuk audio video.

html5 media

Beberapa Format Video yang support pada HTML5

Format File
MPEG .mpg
.mpeg
AVI .avi
WMV .wmv
QuickTime .mov
RealVideo .rm
.ram
Flash .swf
.flv
Ogg .ogg
WebM .webm
MPEG-4
or MP4
.mp4

Beberapa Format Audi yang support untuk HTML5

Format File
MIDI .mid
.midi
RealAudio .rm
.ram
WMA .wma
AAC .aac
WAV .wav
Ogg .ogg
MP3 .mp3
MP4 .mp4

Contoh penerapan code video pada HTML5

<video width=”320″ height=”240″ controls>
<source src=”movie.mp4″ type=”video/mp4″>
<source src=”movie.ogg” type=”video/ogg”>
Browser Anda tidak support dengan tag video ini.
</video>

Apabila ingin langsung autoplay tinggal ubah code “controls” pada tag “video” menjadi “autoplay”.

<video width=”320″ height=”240″ autoplay>

Untuk beberapa file video pada browser support

Browser MP4 WebM Ogg
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox YES YES YES
Safari YES NO NO
Opera YES (from Opera 25) YES YES

Penerapan code Audio pada HTML5

<audio controls>
<source src=”horse.ogg” type=”audio/ogg”>
<source src=”horse.mp3″ type=”audio/mpeg”>
Browser Anda tidak support dengan tag audio ini.
</audio>

Untuk Browsernya

Browser MP3 Wav Ogg
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox YES YES YES
Safari YES YES NO
Opera YES YES YES

Untuk tipe medianya

File Format Media Type
MP3 audio/mpeg
Ogg audio/ogg
Wav audio/wav

Artikel Terkait

Cara mudah membuat theme wordpress responsif dengan bootstrap part 1

Tidak butuh banyak waktu untuk membuat theme wordpress menggunakan bootstrap, hal ini dikarenakan kita menggunakan resource kerangka template yang sudah ada, kita hanya mengatur posisi dan tampilan

Cara mudah untuk membuat custom term dalam wordpress

Dalam wordpress term yang tersedia default adalah category dan tags, langsung saja cara membuat term taxonomy pada wordpress. Langkah pertama adalah masuk pada bagian functions.php, contoh term kali
Tutorial , , ,
Belum ada komentar. Anda bisa menjadi yang pertama untuk berkomentar!

Tinggalkan komentar

*
*
-

error: Content is protected !!