Cara Membuat Efek Fade JQuery Pada Blog

16 Desember 2011

Tutorial singkat ini menjelaskan cara menambahkan efek memudar jquery untuk gambar Sobat di blogger atau web lain. Sangat mudah dan Sobat dapat melakukannya kurang dari satu menit. Efek ini akan menambahkan beberapa penampilan yang menarik untuk blog atau situs web.

Langkah-langkah Membuat Efek Fade JQuery Pada Blog :

1.Login ke dashboard blogger Sobat, pilih tata letak Edit HTML

2.Scroll di mana Sobat melihat "<head>".

3.Copy kode di bawah ini dan paste tepat sebelum "</head>".

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(".post img").fadeTo("slow", 1.0); // This sets the opacity of the thumbs to fade down to 30% when the page loads
$(".post img").hover(function(){
$(this).fadeTo("slow", 0.5); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo("slow", 1.0); // This should set the opacity back to 30% on mouseout
});
});

</script>
<script type='text/javascript'>
$(document).ready(function(){
$(".latest_img").fadeTo("slow", 1.0); // This sets the opacity of the thumbs to fade down to 30% when the page loads
$(".latest_img").hover(function(){
$(this).fadeTo("slow", 0.5); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo("slow", 1.0); // This should set the opacity back to 30% on mouseout
});
});
</script>

4.Simpan template Sobat.

6 komentar:

Icah Banjarmasin mengatakan...

Berkunjung gan..

Unknown mengatakan...

ini perlu di coba gan :)

ayo mampir ke blog saya ..
kalau bisa tukeran link :)

Anonim mengatakan...

sangat bermanfaat infonya kawand, kebetulan saya lagi cari ginian :)

Unknown mengatakan...

Nice Info mas :D

San San mengatakan...

ijin nyimak gan.. :) keep post..

Unknown mengatakan...

menarik nih wajib di coba

Posting Komentar

Ĭ