Membuat Jquery Image Hover Fade Effect pada Template blogspot

Cara pemasangan

    Login ke blogger
    Masuk ke Rancangan >> Edit HTML

    Rancangan

    Edit HTML
    Cari kode </head> lalu tambahkan kode di bawah ini tepat di atasnya

    <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>
  
    Setelah itu simpan dan lihat hasilnya

Telisik lebih lanjut script Jquery Image Hover Fade Effect

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js">

kode diatas ini berguna untuk memanggil frame work, apabila template kamu sudah mempunyai kode tersebut, lebih baik tidak usah di pasang lagi, karena akan memberatkan template kamu saja

<script type='text/javascript'>

Script diatas menunjukan identitas Javascript

$(document).ready(function() {

Menunjukan script ini siap untuk di buka atau di load

$('img').fadeTo('slow', 0.5);

Script yang menunjukan efek fade

$('img').hover(function() {

pada saat kursor tepat diatas gambar maka...

$(this).fadeTo('slow', 1.0);

Tag gambar akan diperjelas hingga 1.0

}, function() {

Jika mouse meninggalkan gambar

$(this).fadeTo('slow', 0.5);

maka gambar akan kembali pada opacity awal (0.5)

}); });

Script penutup

</script>

Menunjukan script javascript tersebut ditutup atau selesai.

sumber: http://oketrik.blogspot.com/2011/05/jquery-image-hover-fade-effect-for.html

Membuat Jquery Image Hover Fade Effect pada Template blogspot

Posted by: Risalahati Dedic Ahmad Updated at: 02:08