Sabtu, 08 Oktober 2011

Membuat fade effect pada gambar dengan jquery


Postingan kali ini saya akan membahas mengenai cara membuat fade effect pada gambar dengan jquery kenapa jquery..? css kan bisa memang bisa tapi pergerakan fade nya itu kasar jika menggunakan css bisa lembut jika menggunakan tambahan css3 transition tapi browser masih banyak yang belum mendukung css3 jadi untuk Fallback nya di gunakan aja trik dari jquery ini.

1. Cari kode </head>
2. Masukan kode di bawah ini di atas kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js'/>
<script type='text/javascript'>
$(document).ready(function() {
$('img').fadeTo('slow', 0.5);
$('img').hover(function() {
$(this).fadeTo('slow', 1.0);
}, function() {
$(this).fadeTo('slow', 0.5);
});
});
</script>

3. Klik Simpan Template dan selesai.