Beranda
HTML

Kode Praktis HTML5: Memilih Angka Menggunakan Slider

Subscribe channel BangHaji CotCom

Dalam keadaan tertentu kadang kita diminta memilih angka dengan range tertentu, misalnya memilih angka dari 0 sampai dengan 10. Nah, selain dengan menggunakan isian, kita juga bisa memilih angka dengan bantuan slider yang dapat digeser. Kode praktis kita kali ini adalah bagaimana menggunakan atau menampilkan slider pada halaman HTML, terutama HTML5.

Slider

Tag HTML yang digunakan masih tetap input tetapi dengan type yang berbeda. Type yang dipakai adalah range. Perhatikan kode berikut.

<input type="range">

Agar lebih mudah dipahami, silahkan coba kode di bawah ini.

<!DOCTYPE HTML><html><head>   <title>Menampilkan Slider</title></head><body>   <h1>Slider</h1>   <form>      <fieldset>       <legend>Pilih Angka Anda</legend>       Silahkan geser:<br><br>         0 <input type="range" name="angka" min="0" max="10" value="3"> 10<br><br>         <input type="submit" value="Kirim">    </fieldset>	    </form></body></html>

Pada kode di atas, disebutkan juga nilai minimum (min=”0″) dan nilai maksimum (max=”10″) serta nilai awal yang terpilih yaitu angka 3 (value=”3″).

Gambaran hasilnya kira-kira seperti berikut ini.

Slider HTML5

Oke, demikian cara memilih angka menggunakan slider HTML5 dengan tipe input range. Kode praktis lainnya yang akan kita bahas adalah membuat format jam pada input HTML, tunggu di banghaji dot com 😎

Related Posts