Unsecured debt consolidation loan


Thursday, 17 December 2009

Membuat Submit Button Berupa Gambar (JavaScript)


Hello, jumpa lagi dengan saya, hihihi kayak di radio aja. Langsung aja deh ke topik.


Seperti yang sudah saya janjikan pada postingan sebelumnya tentang membuat submit button yang berupa gambar. Pada postingan kemarin saya menjelaskan cara membuatnya dengan HTML dan kali ini saya akan menjelaskan cara membuatnya dengan JavaScript.

Berikut adalah kode scriptnya.

<HTML>
<HEAD>
<TITLE>Image Button</TITLE>
</HEAD>
<BODY>
<form name="form" action='kirim.php' method='post'>
Nama: <input type='text' name='nama'>
<a href="javascript:document.form.submit()"
onmouseover="document.form.sub_but.src='gambar1.jpg'"
onmouseout="document.form.sub_but.src='gambar2.jpg'"
onclick="return val_form_this_page()">

<img src="gambar2.jpg" border='0' alt="Submit this form"
name="sub_but"/></a></td>
</form>
</BODY>
</HTML>

Pada baris kode di atas kita mengganti input type - nya dengan link berupa javascript sehingga ketika kursor kita letakan di atas button. Maka gambarnya akan berubah, dari yang tadinya gambar2.jpg menjadi gambar1.jpg. Dan ketika kursor kita keluarkan dari button, maka gambar akan kembali seperti semula.

Lalu onclick="return val_form_this_page()" berfungsi sebagai perintah untuk mengembalikan nilai form ketika diklik.

Nah disinilah kelebihan javascript, kita bisa membuat tampilan menjadi lebih elegan dan lebih indah dibandingkan HTML.

Silakan download file-file tutorial membuat submit button disini.

Oke sekian dolo neh bagi-bagi ilmunya. Dah pegel jari-jarinya. Ikuti terus yah perkembangan blog ini melalui email, tinggal isiin aja email kamu di form "Langganan Artikel via Email" yang ada di PKS (pojok kanan atas)...

2 comments:

password unzip-nya apa nih?
thanx

passwordnya ada di dalam file password.txt

Post a Comment

Enter your email address:

Delivered by FeedBurner