live demo
Tutorial blog tentang popular posts thumbnail berputar yaitu artikel yang kerap di baca dengan efek gambar berputar saa di sorot mouse.
Cara membuat popular posts thumbnail berputar:
1. Add gadget > popular postts > checklist thumbnail dan snipet > simpan
2. Letakkan kode css berikut di atas ]]></b:skin>
.PopularPosts .item-title{display:none}
.PopularPosts .widget-content ul li{background:none repeat scroll 0 0 transparent; float:right; list-style:none outside none; margin:10px 0 0 !important; padding:0 !important}
.PopularPosts .item-thumbnail{margin:0 8px !important}
#PopularPosts1 img:hover{-moz-transform:scale(1.2) rotate(-350deg); -webkit-transform:scale(1.2) rotate(-350deg); -o-transform:scale(1.2) rotate(-350deg); -ms-transform:scale(1.2) rotate(-350deg); transform:scale(1.2) rotate(-350deg); -webkit-box-shadow:0 0 0px rgba(255,0,0,.4),inset 0 0 0px rgba(255,255,255,1); -moz-box-shadow:0 0 0px rgba(255,0,0,.4),inset 0 0 0px rgba(255,255,255,1); box-shadow:0 0 0px rgba(255,0,0,.4),inset 0 0 0px rgba(255,255,255,1)}
.item-thumbnail img{-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; transition:all 0.5s ease; border:3px solid #ccc; height:60px; padding:3px; width:60px}
3. save template.
