Widget Popular Post Efek Snipped Sliding unik ini berfungsi untuk menampilkan artikel yang sering di buka atau dibaca oleh pengunjung blog dan Widget unik ini akan lebih pas dan cocok dengan template blog metro style.
Caranya cukup diletakkan diatas code ]]><b:skin>
Code CSS nya adalah :
.popularposts .widget-content ul li{padding:0;position:relative} .item-snippet { font-size: 90%; line-height: 1.2em; position: absolute; width: 200px; background-color: #27ae60;color:#fff; padding: 7px; border: 1px solid #27ae60; z-index: 2; left: 300px; top: 50%; height: auto!important; visibility: hidden; opacity: 0; transition: all 0.6s cubic-bezier(1,2,0,0) 0s; -moz-transition: all 0.6s cubic-bezier(1,2,0,0) 0s; -webkit-transition: all 0.6s cubic-bezier(1,2,0,0) 0s; -o-transition: all 0.6s cubic-bezier(1,2,0,0) 0s;} .popularposts .widget-content ul li:hover .item-snippet{left:60px;opacity:1;visibility:visible} .popularposts img{width:50px;height:50px} .popularposts .item-title{font-family:'Open Sans Condensed',"Arial Narrow",Arial,sans-serif;font-size:125%}
Selesai
Caranya cukup diletakkan diatas code ]]><b:skin>
Code CSS nya adalah :
.popularposts .widget-content ul li{padding:0;position:relative} .item-snippet { font-size: 90%; line-height: 1.2em; position: absolute; width: 200px; background-color: #27ae60;color:#fff; padding: 7px; border: 1px solid #27ae60; z-index: 2; left: 300px; top: 50%; height: auto!important; visibility: hidden; opacity: 0; transition: all 0.6s cubic-bezier(1,2,0,0) 0s; -moz-transition: all 0.6s cubic-bezier(1,2,0,0) 0s; -webkit-transition: all 0.6s cubic-bezier(1,2,0,0) 0s; -o-transition: all 0.6s cubic-bezier(1,2,0,0) 0s;} .popularposts .widget-content ul li:hover .item-snippet{left:60px;opacity:1;visibility:visible} .popularposts img{width:50px;height:50px} .popularposts .item-title{font-family:'Open Sans Condensed',"Arial Narrow",Arial,sans-serif;font-size:125%}
Selesai
0 Response to "Popular Post Efek Snipped Sliding"