Pemrograman Web - Audio & Video

-
Assalamualaikum wr.wb
Pada artikel kali ini kita akan belajar tentang penggunaan Audio dan Video dalam HTML. ada beberapa Tag yang akan kita gunakan disini diantaranya:
- <audio> & </audio>     : Biar bisa masukin Audio
- <video> &</video>      : Biar bisa masukin Video
- <source src="Lokasi"> : Untuk memilih Audio / Video yang ingin digunakan
- <embed src="Lokasi"> : Untuk memasukan Video autoplay atau Flash (Embed)


Audio

Begini contoh penggunaanya:

 Kodingan bisa dilihat disini : Audio

Oh iya, karena File yang dipakai berasal dari PC saya jadi Audionya nggak akan bisa diputar di PC lain. Jadi, kalau mau Audionya kedengeran coba masukin Musik dari PC kalian

Selain itu, kita juga bisa menampilkan Audio Autoplay (langsung jalan tanpa di Klik)

Begini contoh penggunaanya:


  Kodingan bisa dilihat disini : Audio Autoplay

Lagi, Audionya mungkin nggak bisa diputar di PC lain. tapi seenggaknya Kodinganya bisa dilihat

 

Video

Untuk Video, begini contoh penggunaanya:


 Kodingan bisa dilihat disini: Video

Selain itu, kita juga bisa membuat Video dengan Thumbnail tertentu. Tunggu.. 
Thumbnail itu apa sih? Yang jelas Thumbnail disini artinya bukan Jempol ya..

Thumbnail disini berarti Gambar yang mewakili Video. Jadi maksudnya sebelum Video itu di Klik "Play" maka akan ada Gambar yang mewakilinya. 

Contoh penggunaanya seperti ini:

Sebelum di Klik "Play":


Sesudah di Klik "Play":


 Kodingan bisa dilihat disini: Video Thumbnail

 

Flash 

Selain itu, kita juga bisa memasukan File Flash yaitu File Interaktif 
(Bisa diklik, semacam Game, atau Animasi) yang berformat .swf kedalam Html juga.

 Begini contoh penggunaanya:


Kodingan bisa dilihat disini : Flash

Latihan 

Setelah tau cara makenya sekarang coba kita buat sesuatu. Disini saya akan coba untuk membuat sebuah Halaman yang isinya ada Video / Audio / Flashnya

gini nih:


Terakhir, Karena kebanyakan Contoh dalam Artikel kali ini memerlukan Data berupa Audio / Video / Flash yang tersimpan di Komputer, maka akan lebih baik jika saya Bagikan saja File HTML dan Audio / Video / Flashnya langsung

Bisa diunduh di sini: Audio,Video,Flash
  

Terimakasih telah membaca, Wassalamualaikum wr.wb

Komentar

Posting Komentar

Postingan populer dari blog ini

Analisis Web - Code Wars

-
Gambar
Yasfa Zamzami - XI RPL 1 Assalamualaikum Wr.wb Pada Artikel kali ini kita akan melakukan sesuatu yang sedikit berbeda dengan Artikel yang lain. Dalam Artikel lain, Biasanya kita belajar Ngoding . Namun pada Artikel kali ini kita akan Menganalisis Salah Satu Situs E - Learning yang ada di Internet disini kita akan Menganalisis Situs Code Wars Apa itu Code Wars? Jadi, Code Wars adalah Website E Learning (Pembelajaran Online) yang memberikan beberapa Latihan atau Tantangan yang bisa kita ikuti untuk menguji Skill kita. Code Wars adalah situs Pembelajaran Koding yang menggunakan tema "Bela Diri" Dalam Code Wars Codewarrior (User) memiliki Level dari 7 kyu sampai 2 Dam (Urutan : 7 kyu, 6 kyu, 5 kyu, 4 kyu, ..... , 1 dam, 2 dam) Untuk meningkatkan Peringkat  Codewarrior  harus mendapatkan Honor dengan cara menyelesaikan Kata.  Kata? apa itu? susunan Huruf yang menyusun Kalimat? Bukan, bukan itu, Kata disini diambil dari Istilah Bela Diri yang bera
Baca selengkapnya

Pemrograman Web - PBO dalam JavaScript

-
Assalamualaikum Pada Artikel kali ini kita akan belajar tentang PBO sederhana dalam JavaScript Dalam PBO kita akan banyak menggunakan Fungsi jadi saya sarankan untuk membaca Artikel sebelumnya tentang Fungsi pada JavaScript Definisi PBO Apa itu PBO? PBO (Pemrograman berbasis Objek) atau bahasa keren nya OOP (Object Oriented Programming) adalah cara ngoding yang berfokus pada Objek. Terus kalau Objek apa? Objek itu sendiri adalah sekumpulan Variabel , Fungsi , dan Prosedur, yang disatukan dalam 1 Class lalu diperlakukan layaknya Objek di dunia Nyata. Misalnya kita mau buat Objek Nyamuk. Kita tentuin Sifat dari Nyamuk itu apa aja terus jadiin jadi Variabel. Lalu setelahnya, kita tentuin Tindakan yang bisa dilakukan nyamuk itu apa aja terus jadiin Fungsi atau Prosedur. Misalnya gini nih: Objek : Nyamuk  Variabel: - Usia - Kecepatan Terbang - Darah yang dihisap Fungsi / Prosedur: - Terbang -  Menghisap Darah PBO dalam JavaScript Barusan itu sedikit gambara
Baca selengkapnya

Pemrograman Web - JavaScript Loop & Fungsi

-
Assalamualaikum wr.wb Pada Artikel kali ini saya akan membahas tentang Looping atau Pengulangan dalam JavaScript. Apa itu Looping? Yaa...  Looping itu pengulangan. kumpulan Kode dalam tanda {} akan dijalankan terus menerus selama Kondisi / Syarat terpenuhi. Misal : (Selama belum sampai tujuan) { Jalan } (Selama belum berhasil) {Usaha } Untuk melakukan Looping dalam JavaScript digunakan While, Do While, dan, For. While While digunakan untuk melakukan perintah tertentu secara berulang selama Kondisi / Syarat terpenuhi. Penulisanya: while (kondisi) { //Kode yang ingin dijalankan }  Contohnya: Loop Teks See the Pen WhileLoop by Yasfa Zamzami ( @Yasfa ) on CodePen . Bisa kita lihat dari Kodingan diatas bahwa perintah yang berada didalam { } diulangi terus selama Syarat x < 5 terpenuhi  Do While Do While nggak terlalu beda sama While. Cuma ada 2 perbedaan. Pertama, untuk Do While perintah di dalem { } dijalanin dulu baru Syaratnya di Cek (Kalau While s
Baca selengkapnya