Gambar Input
Suatu gambar atau yang sering di sebut dengan image atau png dalam bahasa programming, bisa juga menjadi element input, yang sudah saya pernah jelaskan sebelumnya di artikel "Cara Menampilkan Gambar Background Pada Website" kalian bisa baca di artikel sebelumnya, untuk penjelasan lebih detail.
Seringkali diperlukan cara untuk memberikan informasi yang visual antara halaman html dengan para pengunjungnya. Misalnya saja kita dapat menampilkan ramalan cuaca dari kota tertentu saat pengunjung meng-klik posisi kota tersebut di peta.
Element input type gambar ini akan memberikan posisi yang di-klik pada gambar dalam ukuran pixel.
Posisi ini diukur relatif terhadap pojok kiri-atas gambar :
<html>
<head>
<title>Form Ke 3 - Kontrol Image </title>
</head>
<body>
<form>
<input type="image" name="gambar" src="Android.png">
</form>
<!-- Website Complete Coding Blogspot -->
</body>
</html>
Perhatikan tag input tersebut, Disini atribut yang dipakai adalah "image". Element ini diberikan nama "gambar" dan gambar diambil dari file "Android.png".
Setelah halaman HTML ini di muat di browser dan di-klik di daerah gambar akan di hasilkan tampilan berikut :
 |
| Gambar sebagai element input form |
Kalau kita perhatikan pada baris location terdapat tambahan string baru seperti :
file:///C:/Users/David/Desktop/form3.html?gambar.x=405&gambar.y=608
Gambar.x adalah posisi titik pada gambar yang di-klik diukur dari ujung kiri gambar dan Gambar.y di ukur dari atas gambar. Jadi arti dari informasi di atas adalah gambar di-klik pada 405 piksel mendatar dan 608 piksel vertikal dari titik kiri-atas.
Belum ada tanggapan untuk "Gambar Sebagai Element Input"
Posting Komentar