Widodo

Membuat Efek Placehoder dengan placeholdem

Effel Placeholder

HTML5 telah memperkenalkan beberapa fitur tambahan yang telah diimplementasikan di beberapa browser versi terbaru. Satu diantaranya yang sering kali digunakan dalam mendesain elemen form.

Placeholder. Placeholder berfungsi untuk membuat teks di dalam sebuah input form. Teks tersebut akan disembunyikan ketika form telah diisi atau kursor telah diklik fokus ke form tersebut.

Untuk itu saya akan membuat effek placeholder animasi Placeholdem dengan menggunakan jquery dan placeholdem.min.js itu itu langsung aja kita pelajari

1. Silahkan buat form input misalkan form input kontak dll. atau bisa memakai script dibawah ini

<input name="nama" placeholder="Nama Anda" />
<input name="email" placeholder="Email Anda" />
<input name="subject" placeholder="Subject Anda" />
<textarea name="pesan" placeholder="Pesan Anda"></textarea>

2. Silahkan copy paste javascript dibawah ini

<script>
Placeholdem( document.querySelectorAll( '[placeholder]' ) );
function incFade() {
if( i < fadeElemsLength ) {
fadeElems[ i ].className += ' fade-load';
i++;
setTimeout( incFade, interval );
}
}
setTimeout( incFade, interval );
</script>

 

Sildahkan download placeholdem.min.js


0 Komentar