WIDGET RECENT POST ANIMASI DENGAN JQUERY

Assalamu'alaikum...!

Salam blogger, pakabar sahabat blogger semua, dipagi hari yang cerah dan suasana yang dingin dikarenakan di desaku dimana saya tinggal habis diguyur hujan loh...!!!tidak begitu aja tadi sewaktu anterin adek sekolah di jalan kehujanan yahh mau gimna lagi tak bawa jas hujan akhirnya hujan-hujanan deh!!!!!

Seiring dengan kemajuan java sript widget recent post menampilkan gaya baru ala masakini loh,,,,xixixi kayak masakan aja ala masakini, yahhh begitulah kenyataannya, sebuah recent post yang bisa berganti-ganti dengan animasinya yang keren, saya yakin pasti temen blogger semua sudah banyak yang tau 

Widget Recent Post Animasi Dengan JQuery

Namun apasalahnya saya berbagi sapa tau temen blogger blm ada yang tau dan bisa mencoba,,,nah bisa menambah pengetahuan kannn....berbagi itu kan gak rugi ya gak kata Bapak TB kalau ilmu yang tax di amalkan bagaikan pohon yang tak berbuah, betul kan....ehemmm....baiklah kalau begitu langsung aja ke TKP di mana saya meletakkan java scriptnya :

1. Setelah sig in pada blogger dengan account anda>>>pada dasbor klik rancangan >>>
pada elemen laman >>>klik tambah gadget >>>HTML/JavaScript >>>

2. Copy kode berikut dan paste pada kolom konten

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

<script language='JavaScript'>

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 70;

thumbheight = 70;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = true;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://qinginbisa.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src='http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>

Seperti itulah kodenya hemmm,,,,PERLU DI KETAHUI JANGAN LUPA ALAMAT home page di ganti dengan alamat blog sobat (tulisan warna merah silahkan diganti alamat blog sobat).

oya...dan jangan lupa disimpan iyahhhh hehehe,,,,
oke deh.......!!!!

SELAMAT MENCOBA SEMOGA ANDA BERHASIL DAN SUKSES SLL