Membuat Popular Post Thumbnail CSS - Triks Cara membuat Popular berbentuk Thumbnail Baru. Berikut ini adalah cara membuat popular post seperti yang ada pada blog ini menggunakan CSS yang cukup simple dan menarik. Ada Hovernya, caranya kamu add popular post dulu di Widget blogmu centang yang thumbnail saja.
Popular Post dengan Thumbnail |
Langkahnya :
1. Copy script berikut ini diatas code ]]</b:skin>
.sidebar .popular-posts ul li img:hover, .cross2 ul li img:hover {-moz-transform:scale(1.1) rotate(-0deg); -webkit-transform:scale(1.1) rotate(-0deg); -o-transform:scale(1.1) rotate(-0deg); -ms-transform:scale(1.1) rotate(-0deg); transform:scale(1.1) rotate(-0deg);filter:alpha(opacity=100);opacity:1;border-radius: 50%;}2. Simpan
.sidebar .popular-posts ul{margin:0;padding:2px;}
.PopularPosts .widget-content ul li {padding: .1em 0;}
.sidebar .popular-posts ul li {margin: 0 3px;background:none;float:left;width:85px;list-style-type:none;border:none;line-height:0px;}
.sidebar .popular-posts ul li img {-webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; transition:all 0.5s ease;width: 85px;height: 85px;opacity: 0.7;opacity:0.7;filter:alpha(opacity=70);background:#444; border:1px solid #191919; border-bottom:1px solid #666; border-right:1px solid #666;padding:2px;}
.PopularPosts .item-thumbnail {margin: 0;}
.sidebar .PopularPosts .item-title {display: none;}
3. Selesai
Cukup simple dan mudah bukan Membuat Popular Post Thumbnail CSS
Thanks its works. . . .
ReplyDelete