Kumpulan Script Untuk Desain Blog
Ada beberapa script yang lumayan dapat menunjang berdirinya blog dengan menempatkan script tertentu untuk keperluan desain Blog dan tak kalah pentingnya dengan Widget itu sendiri.Karena pada dasarnya Blog/ Web adalah merupakan kumpulan Script yang terangkai sehingga membentuk satu kesatuan yang utuh hingga terbentuk yang namanya Blog, Wordpress, Multiply dan lain-lain.
Berikut ini adalah Scriptnya :
1. Button
a. Scipt 1
Kode :
<button>Hallo Dunia</button>
Hasil :
Kode :
<form action="">
<input type="button" value="Hello world!">
</form>
Hasil :
Kode :
<form action="">
Nama depan: <input type="text" name="Nama depan"><br>
Nama belakang: <input type="text" name="Nama belakang">
</form>
<p><b>Catatan:</b> Form tidak tampak. Juga default karakter max. 20 karakter.</p>
Hasil :
3. Password Area
Kode :
<form action="">
Username: <input type="text" name="user"><br>
Password: <input type="password" name="password">
</form>
<p><b>Note:</b> Karakter yang ditampilkan tertutup dan tampil * atau bentuk lain.</p>
Hasil :
4. Checkbox / kotak centang
Kode :
<form action="">
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>
Hasil :
I have a bike
Note: Ketika Tombol Radio di cek maka akan ter-Cek, artinya semua yang berhubungan dengan yang di cek jadi terikat.
6. Simple Drop Down Menu
Kode :
<form action="">
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>
Hasil :
Kode :
<h3>Kirim e-mail ke seseorang@contoh.com:</h3>
<form action="MAILTO:seseorang@contoh.com" method="post" enctype="text/plain">
Name:<br>
<input type="text" name="nama" value="Nama anda"><br>
E-mail:<br>
<input type="text" name="email" value="Alamat email"><br>
Comment:<br>
<input type="text" name="Comment" value="Komentar anda" size="50"><br><br>
<input type="submit" value="Kirim">
<input type="reset" value="Batalkan">
</form>
Hasil :
Kirim e-mail ke seseorang@contoh.com:
10. Video Control
Kode :
<button onclick="getAudioTracks()" type="button">Cari Audio Track yang tersedia</button>
<br>
<video id="video1" controls="controls">
<source src="mov_bbb.mp4" type="video/mp4">
<source src="mov_bbb.ogg" type="video/ogg">
Your browser does not support HTML5 video.
</video>
<script>
myVid=document.getElementById("video1");
function getAudioTracks()
{
alert(myVid.audioTracks.length);
}
</script>
<p>Video courtesy of <a href="http://www.bigbuckbunny.org/" target="_blank">Big Buck Bunny</a>.</p>
Hasil :
0 komentar:
Post a Comment
No spam...