Mewatermark-an form input

Mewatermark-an form input ? apa maksudnya tuh ?

Mungkin sebagian teman bingung dengan istilah ini,,begitu juga bingungnya saya mencari coding membuat salah satu form. Liat-liat form input di Facebook, ada muncul pertanyaan :

kok ini form sebelum di klik muncul kata “Pencarian” lalu setelah di klik,,textnya menghilang,,lalu apabila kita klik halaman lain,,text “Pencarian” muncul kembali.

Searching di Mbah Google..wew,,ini namanya watermark form..oh…
Watermark form itu saya dapat di plugin jquery, tepatnya di alamat ini.

Berikut ini saya buat sample sederhananya :

saya buat file form.html, berikut codenya :

<html>
<head>
	<title>watermark form - adiputra</title>

	<script language="javascript" src="jquery-1.3.2.min.js"></script>
	<script language="javascript" src="jquery.watermark.min.js"></script>

	<script language="javascript">
		$(document).ready(function(){
			$(".adiuser").watermark("username");
			$(".adipass").watermark("password");
		});
	</script>

</head>
<body>
	<form>
		<input type='text' class='adiuser' value='' />
		<input type='text' class='adipass' value='' />
	</form>
</body>
</html>

Setelah itu, jangan lupa menyertakan jquery-1.3.2.min.js dan jquery.watermark.min.js dan coba di running.

Sama bukan ?
Simple ya ternyata…

code bisa kamu comot di alamat ini

dan untuk melihatnya kini bisa teman liat demo disini

6 thoughts on “Mewatermark-an form input

  1. Ping-balik: Code Pencarian sederhana di Facebook « Mari Terus Belajar Dan Berbagi

  2. @ Nizar :
    mangga mangga mas,,saya nyimak saja..hehe..
    mungkin nanti setelah lulus saya mulai buat ini itu..
    mw konsen ke kuliah dulu,,tanggung selangkah (1tahun) lagi insyAllah..

    mohon doanya..:)

  3. Ping-balik: Code Pencarian sederhana seperti pada Facebook | Blog Adiputra

Silahkan Komentar...

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s