Hallo teman-teman Dumet School. Kembali lagi dengan saya di Kursus Web Design. Kali ini saya akan membahas tentang cara Membuat Nilai Pada Range Menggunakan Javascript. Dimana ketika kita scroll ke kiri atau ke kanan nilai akan berubah sesuai nilai yang kita berikan pada range.

Langkah pertama untuk Membuat Nilai Pada Range Menggunakan Javascript adalah membuat struktur htmlnya terlebih dahulu. Dan berikut scriptnya ya teman-teman.

Teman-teman bisa perhatikan pada script di atas dimana nilai min dan max adalah nilai yang bisa kita atur sesuai kebutuhan. Jika sudah selesai maka kita bisa langsung berikan style cssnya dan berikut scriptnya.

Dan langkah terakhir untuk Membuat Nilai Pada Range Menggunakan Javascript adalah kita buat javascriptnya. Dimana nantinya script ini yang akan mencetak nilai dari range tersebut.

Jika sudah selesai jangan lupa di simpan dengan format html dan jika teman-teman buka di browser masing-masing maka tampilannya akan tampak seperti pada gambar di bawah ini.

Membuat Nilai Pada Range Menggunakan Javascript

Jika di scroll ke arah kiri maka nilai range akan mendekati angka satu.

Membuat Nilai Pada Range Menggunakan Javascript

Dan jika di scroll ke arah kanan maka nilai range akan mendekati angka 100.

Membuat Nilai Pada Range Menggunakan Javascript

Demikian artikel tentang Membuat Nilai Pada Range Menggunakan Javascript. Semoga bermanfaat dan selamat mencoba ya teman-teman.

 

WhatsApp chat