goto edit html, cari kode </head>
copy paste kode ini diatas </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>
save.. beres.. untuk pemahaman java script itu
Memahami Script Code jQuery Image Hover Fade Effect
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js'/>
Kode diatas untuk memanggil framework jQuery, jika anda pernah memasangnya, maka kode ini tidak perlu diikutsertakan.
<script type='text/javascript'>
Script identitas bahwa selanjutnya dikenali sebagai JavaScript
$(document).ready(function() {
Fungsi script jQuery telah siap di-load
$('img').fadeTo('slow', 0.5);
Efek fade sebagai efek default (opacity 0.5) pada semua gambar dengan tag img pada seluruh halaman yang di-load
$('img').hover(function() {
Ketika mouse pointer berada di atas gambar (hover) maka...
$(this).fadeTo('slow', 1.0);
Gambar dengan tag img akan diperjelas hingga 1.0
}, function() {
Jika mouse pointer meninggalkan gambar maka...
$(this).fadeTo('slow', 0.5);
Gambar dengan tag img akan memudar (opacity 0.5) lagi.
});
});
Fungsi script jQuery dihentikan
</script>
Fungsi JavaScript di tutup



Tidak ada komentar:
Posting Komentar