/ / مجموعه اكواد برمجه داخليه لـ المشاركات الشائعه بالصور Posts FAQ blogspot 20 Popular Posts Widget

مجموعه اكواد برمجه داخليه لـ المشاركات الشائعه بالصور Posts FAQ blogspot 20 Popular Posts Widget

7 مشاهدات الان
السلام عليكم

مجموعه ممتازه ويمكنك التعديل فيها من الصور والالوان حسب نوع قالبك 20 Popular Posts Widget

.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFF no-repeat scroll 5px 10px;
list-style-type: none;
margin:0 0 5px 0px;
padding:5px 5px 5px 20px !important;
border: 1px solid #dcdcdc;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
.popular-posts ul li:hover {
background:#FF8040;
}
.popular-posts ul li a
{
text-decoration:none;
font:14px Georgia, verdana;
color:#222222;
}
.popular-posts ul li a:hover {
text-decoration:none;
color:#fff;
}

.popular-posts ul
{
padding-left:0px;
-moz-box-shadow:1px 1px 2px #dcdcdc;
-web-kit-box-shadow: 1px 1px 2px #dcdcdc;
-goog-ms-box-shadow:1px 1px 2px #dcdcdc;
box-shadow:1px 1px 2px #dcdcdc;
border: 1px solid #dcdcdc;
}
.popular-posts ul li {
list-style-type: none;
margin:0 0 5px 0px;
padding:5px 5px 5px 20px !important;
border-bottom:1px dashed #dcdcdc;
background:#ffffff;
}
.popular-posts ul li a
{
text-decoration:none;
font:16px georgia,verdana;
color:#3d87c4;
}
.popular-posts ul li a:hover {
text-decoration:none;
color:#333333;
}

.popular-posts ul{padding-left:0px;}
.popular-posts ul li {
list-style-type: none;
margin:0 0 5px 0px;
padding:5px 5px 5px 20px !important;
border: 1px solid #dddddd;
-moz-box-shadow:1px 1px 2px #dcdcdc;
-web-kit-box-shadow: 1px 1px 2px #dcdcdc;
-goog-ms-box-shadow:1px 1px 2px #dcdcdc;
box-shadow:1px 1px 2px #dcdcdc;
border-radius:5px;
background: rgb(44,83,158);
background: -moz-linear-gradient(top, rgba(44,83,158,1) 0%,rgba(44,83,158,1) 100%);
background: -webkit-gradient(linear, left top, left bottom,color-stop(0%,rgba(44,83,158,1)),color-stop(100%,rgba(44,83,158,1)));
background: -webkit-linear-gradient(top, rgba(44,83,158,1)0%,rgba(44,83,158,1) 100%);
background: -o-linear-gradient(top, rgba(44,83,158,1)0%,rgba(44,83,158,1) 100%);
background: -ms-linear-gradient(top, rgba(44,83,158,1)0%,rgba(44,83,158,1) 100%);
background: linear-gradient(to bottom, rgba(44,83,158,1)0%,rgba(44,83,158,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2c539e', endColorstr='#2c539e',GradientType=0 );
}
.popular-posts ul li:hover {
-moz-box-shadow:1px 1px 2px #dcdcdc;
-web-kit-box-shadow: 1px 1px 2px #dcdcdc;
-goog-ms-box-shadow:1px 1px 2px #dcdcdc;
box-shadow:2px 2px 4px #333333;
border:1px solid #333333;
color:#fff;
}
.popular-posts ul li a
{
text-decoration:none;
font:16px Georgia, verdana;
color:#ffffff;
}
.popular-posts ul li a:hover {
text-decoration:none;
}

#PopularPosts1 ul lia:hover{color:#fff;text-decoration:none}
#PopularPosts1 ul li a {-webkit-text-size-adjust: auto;-webkit-text-stroke-width: 0px; color: #333333; display: block;font-family: Georgia, 'Times New Roman', Times, serif; font-size:13px; font-style: normal; font-variant: normal; font-weight: normal;letter-spacing: normal; line-height: 18px; margin: 0px 10px 0px-5px; min-height: 30px; orphans: 2; padding: 0px; text-align:-webkit-auto; text-decoration: none !important; text-indent: 0px;text-transform: none; white-space: normal; widows: 2; word-spacing:0px; }
#PopularPosts1 ul li.item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:51px;height:51px}
#PopularPosts1 ul li:first-child:after,
#PopularPosts1 ul li:first-child + li:after,
#PopularPosts1 ul li:first-child + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li +li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li +li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li+ li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li+ li +li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2pxsolid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px#000;-moz-box-shadow: 0px 0px 5px#000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li{background:#DF01D7;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li +li:after{content:"8"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li+li{background:#B041FF;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li+ li:after{content:"9"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li+li +li{background:#F52887;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li+ li + li:after{content:"10"}
#PopularPosts1 ul li:first-child + li + li + li + li+li{background:#7ee3c7;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li +li:after{content:"6"}
#PopularPosts1 ul li:first-child + li + li + li + li + li+li{background:#f6993d;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li +li:after{content:"7"}
#PopularPosts1 ul li:first-child + li + li + li +li{background:#33c9f7;width:90%}
#PopularPosts1 ul li:first-child + li + li + li +li:after{content:"5"}
#PopularPosts1 ul li:first-child + li + li +li{background:#c7f25f;width:90%}
#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}
#PopularPosts1 ul li:first-child + li +li{background:#ffde4c;width:90%}
#PopularPosts1 ul li:first-child + li + li:after{content:"3"}
#PopularPosts1 ul li:first-child + li{background:#ff764c; width:90%}
#PopularPosts1 ul li:first-child + li:after{content:"2"}
#PopularPosts1 ul li:first-child{background:#ff4c54 ;width:90%}
#PopularPosts1 ul li:first-child:after{content:"1"}
#PopularPosts1 ul{margin:0;padding:0px 0;list-style-type:none}
#PopularPosts1 ul li{position:relative;margin:6px0;border-radius:25px 0px 25px 0px;border:2px solid#f7f7f7;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow: 3px 3px3px #000;padding:10px;}
#PopularPosts1 img {
border-radius:200px;
width:60px; height:60px;
margin-left:4px;
}


.popular-posts ul{padding-left:0px;}.popular-posts ul li {list-style-type: none;background: #FFFurl(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTDg0LwNPJRLD3SdCcs7K4d38N-ktAHdt6O0y0bnMigX3dr14R9o-ZU5LDncI7DyLYa2i8Yftp6hl-r4WvcQsRyhHGbCDboywfj1FPti3aOW6xWQJWGoY-QKf34YZtR0XWSs43YBbwI0X5/s1600/bo-pp-arrow.gif)no-repeat scroll 5px 10px;border: 1px solid #ddd;padding:5px 5px 5px20px !important;margin:0 0 5px0px;border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;}.popular-posts ul li:hover {border:1px solid #6BB5FF;}.popular-posts ul li a:hover {text-decoration:none;} .popular-posts.item-thumbnail img {border-radius: 100px;-moz-border-radius:100px;webkit-border-radius: 100px; box-shadow: 0 1px 3px rgba(0, 0,0, .4);-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0,.4);-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);}

.PopularPosts h2{
padding-right:.4em;
padding-left:1em
}
.popular-posts ul { padding-left: 0;
counter-reset: trackit;
}
.popular-posts ul li {
border-bottom: 1px solid #ffffff;
list-style: none outside none !important;
margin-left: 0 !important;
overflow: hidden;
padding: 10px 0 !important;
transition: all 0.25s linear 0s;
counter-increment: trackit;
}
.PopularPosts ul li:before{
content: counters(trackit, ".");
padding: 0 .1em 0 0;
font-size: 20px;
font-weight: bold;
color: #ffffff;
float:left;
margin-right:10px;
}
.PopularPosts li:first-child{
border-top:1px solid #000000
}
.PopularPosts li:nth-child(even)
{background:#0099ff
}
.PopularPosts li:nth-child(odd)
{background:#000000
}
.PopularPosts .item-thumbnail {display: true!important},.PopularPosts .item-snippet {
display: true!important}
.PopularPosts a, .PopularPosts a:hover{
color:#ffffff;
font-size:.9rem
}
#PopularPosts1 li{
padding-right: 1em !important;
padding-left: 1em !important;
}
.widget.PopularPosts{padding:1.2em 0em !important}

#PopularPosts1ul{width:300px;counter-reset:li;left:-7px;padding:8px 0px1px;list-style:none;}
#PopularPosts1 li .item-title{float:right!important;}
#PopularPosts1 li{left:5px;width:95%;position:relative;margin:0 010px 0;padding: 3px 2px 0 17px;}
#PopularPosts1 ul li{position:relative;display:block;margin: .5em0;*padding: .2em;background:#ddd;padding: .4em .2em .4em1em;transition: all .3s ease-out;border-radius:.3em;text-decoration: none;}
#PopularPosts1 ulli:before{position:absolute;background:#000;color:#fff;content:counter(li);counter-increment: li;margin: -1.3em;left: 0;top:50%;width: 2em;border: .2em solid #fff;height: 2em;border-radius:2em;font-weight: bold;font-size: 15px;text-align:center;line-height: 2em;box-shadow: 0 8px 5px -7px#888;-moz-box-shadow: 0 8px 5px -7px #888;-webkit-box-shadow: 0 8px5px -7px #888;transition: all .3s ease-out;}
#PopularPosts1 ul li:hover:before{transform: rotate(360deg);}
#PopularPosts1 ul li:hover{background: #eee;}
#PopularPosts1 ul li a img{width:25%; float:left; }
#PopularPosts1 ul li .item-title {width:68%; float:right;margin-top:-15px; margin-right:15px;}
#PopularPosts1 ul lia{min-height:25px;color:#444;display:block;font: 14px Georgia,serif;text-decoration:none;text-transform:uppercase;text-shadow: 0-1px 2px #fff;}
#PopularPosts1 ul li a:hover{color: #444;}

.popular-posts{background:#f6f6f6; margin:5px;margin-top:-5px;}
.popular-posts ul{border-radius:3px; box-shadow:0 3px 4px 3px #999;font-size:10pt;margin:0 auto;padding:0}
.popular-posts ul li{border:1px solid #3b95bf;background:#f6f6f6;background:linear-gradient(135deg,#3b95bf0,#f4f8ff 20%,#d1edff 85%,#3b95bf 100%);line-height:2em;list-style-type:none;margin:0;overflow:hidden;padding:10px20px!important; margin-bottom:1.5px;}
.popular-posts ulli:hover{background:#c9d5ea;background:linear-gradient(135deg,#f4f8ff0,#3b95bf 50%,#3b95bf 50%,#f4f8ff 100%);}
.popular-posts ul li a{padding:10px 20px;margin:-10px-20px;display:block}
.popular-posts a{font-weight:bold; font-style:italic; color:#111;text-decoration:none; font-size:16px;}
.popular-posts a:hover{color:#555;}
#PopularPosts1 h2{display:none;}

.popular-posts ul li a {
background: none repeat scroll 0 0 #4E5563;
color: #FFFFFF;
display: block;
margin: 10px 0;
padding: 25px 15px 30px;
position: relative;
text-decoration: none;
transition: all 0.3s ease-out 0s;
width: 87%;
}
.popular-posts ul li a:before {
background: none repeat scroll 0 0 #373C45;
color: #FFFFFF;
font-weight: 700;
height: 2em;
line-height: 2em;
margin-left: 88%;
padding: 2px;
position: absolute;
text-align: center;
width: 2em;
border:1px solid white;
transition: all 0.2s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
}
.popular-posts ul li a:hover {
opacity: 0.8;
}
.popular-posts ul li a:hover:before {
border-left-color: #CCCCCC;
}
.popular-posts ul li:first-child + li + li + li + li + li + li + li+ li + li a:before {
content: "10";
}
.popular-posts ul li:first-child + li + li + li + li + li + li + li+ li a:before {
content: "9";
}
.popular-posts ul li:first-child + li + li + li + li + li + li + lia:before {
content: "8";
}
.popular-posts ul li:first-child + li + li + li + li + li + lia:before {
content: "7";
}
.popular-posts ul li:first-child + li + li + li + li + li a:before {
content: "6";
}
.popular-posts ul li:first-child + li + li + li + li a:before {
content: "5";
}
.popular-posts ul li:first-child + li + li + li a:before {
content: "4";
}
.popular-posts ul li:first-child + li + li a:before {
content: "3";
}
.popular-posts ul li:first-child + li a:before {
content: "2";
}
.popular-posts ul li:first-child a:before {
content: "1";
}
.item-snippet {
display: none;
}
.PopularPosts .item-thumbnail {
display: none;
}

#PopularPosts1h2{position:relative;padding:8px 10px 6px10px;width:100%;margin-bottom: 5px;font-size:17px;color:#757575;text-align:left;}#PopularPosts1ul{list-style:none;counter-reset:li;padding:10px;left:-8px;width:100%;}#PopularPosts1li{ width:100%;position:relative;left:0;margin:0 0 1px12px;padding:4px 5px;}#PopularPosts1 ul li:before{content:counter(li);counter-increment: li;position: absolute; left: -30px;top: 50%;margin-top: -13px;background: #FF9900; height:1.9em;width: 2em;line-height: 2em;text-align: center;font-weight:bold;color: #fff;font-size: 14px;}#PopularPosts1 ulli:after{position: absolute;content: ”;left: -2px;margin-top: -.7em;top: 50%;width: 0;height: 0;border-top: 8px solidtransparent;border-bottom: 8px solid transparent;border-left:10pxsolid #FF9900;}
#PopularPosts1 ul li a{color: #FF8000;text-decoration: none;font-size:15px;}#PopularPosts1 ul li {position: relative;display:block;padding: .4em .4em .4em .8em;*padding: .4em;margin: .5em 0.5em 0.4em;background: #BFE3FE;transition: all .3sease-out;text-decoration:none;transition: all .1sease-in-out;}#PopularPosts1 ul li:hover{background: #eee; }
#PopularPosts1 ul lia:hover{color:#444;margin-left:3px;}

.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFFurl(https://1.bp.blogspot.com/_7wsQzULWIwo/S
modosCuJCI/AAAAAAAABh4/ZSXbVW9Qpa8/s400/261.gif) no-repeat scroll5px 10px;
list-style-type: none;
margin:0 0 5px 0px;
padding:5px 5px 5px 20px !important;
border: 1px solid #000000;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
.popular-posts ul li:hover {
border:1px solid #80C8FE;
}
.popular-posts ul li a:hover {
text-decoration:none;
}

.popular-posts .item-thumbnail img:hover {
opacity: 1;
-webkit-box-reflect: below 0px -webkit-gradient(linear, left top,left bottom, from(transparent), color-stop(.7, transparent),to(rgba(0,0,0,0.4)));
-webkit-box-shadow: 0px 0px 20px rgba(255,255,255,0.8);
-moz-box-shadow: 0px 0px 20px rgba(255,255,255,0.8);
box-shadow: 0px 0px 20px rgba(255,255,255,0.8);
-webkit-transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-o-transform: rotate(-7deg);
}
.popular-posts .item-thumbnail img {
border-radius: 100px 100px 100px 100px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
border: 5px solid #eee;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}
.popular-posts ul li {
margin: 12px;
opacity: 0.8;
border: 5px solid #eee;
border-radius: 100px 100px 100px 100px;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}
.popular-posts a{
font-size: 13px solid;
}

.widget .widget-item-control a img{border:none;width:20px!important;height:20px!important;padding:none;background:none;-moz-box-shadow:none;-webkit-box-shadow:none;-ie-box-shadow:none;box-shadow:none}
.sidebar .PopularPosts .widget-content ul li{padding:0;height:73px!important;overflow:hidden!important;list-style-type:none!important;list-style:none}
.sidebar .popular-posts ul{list-style-type:none!important;counter-reset:popcount;margin:0;padding:0!important}
.sidebar .popular-posts ul li:before{background:rgba(247,247,247,1);color:#000;content:counter(popcount,decimal);counter-increment:popcount;float:right;font-size:15px;line-height:20px;list-style-type:none;padding:0 6px 1px 5px;border-radius:0 0 7px 7px;position:relative;display:inline-block;box-shadow:-2px 2px 10px rgba(187,187,187,0.7);font-weight:400;top:0;right:1px;z-index:999999999999;border:solid #B5B5B5;border-width:0 1px 1px}
.sidebar .PopularPosts .item-thumbnail{float:left;margin:0!important}
.sidebar .PopularPosts img{padding-right:0!important;width:72px;height:72px;overflow:hidden!important;margin-right:0}
.sidebar .PopularPosts .item-title a:hover{background:#f6f6f6;color:#000}
.sidebar .PopularPosts .item-title a{background:#EAEAEA;color:#6E6E6E;display:block;font-size:14px;font-weight:400;line-height:normal;font-family:"Oswald",sans-serif;padding:10px 30px 0 78px;transition:all .4s ease-in-out;height:62px;text-decoration:none;border-bottom:1px solid #ccc}

.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{margin:0;padding:0;list-style:none;border:none;background:none;outline:none}
.PopularPosts ul{margin:.5em 0;list-style:none;color:#000;counter-reset:num}
.PopularPosts ul li{background-color:#eee;margin:0!important;padding:.5em 1.5em .5em .5em !important;counter-increment:num;position:relative}
.PopularPosts ul li a{color:#fff!important}
.PopularPosts ul li a:hover{color:#2c3e50!important}
.PopularPosts ul li:before,.PopularPosts ul li .item-title a,.PopularPosts ul li a{font-weight:700;color:inherit;text-decoration:none}
.PopularPosts ul li:before{content:counter(num)!important;display:block;position:absolute;background-color:#333;color:#fff!important;width:22px;height:22px;line-height:22px;text-align:center;bottom:0;right:0;padding-right:0!important}
.PopularPosts ul li:nth-child(1){background-color:#f1c40f}
.PopularPosts ul li:nth-child(2){background-color:#f39c12}
.PopularPosts ul li:nth-child(3){background-color:#2ecc71}
.PopularPosts ul li:nth-child(4){background-color:#27ae60}
.PopularPosts ul li:nth-child(5){background-color:#e67e22}
.PopularPosts ul li:nth-child(6){background-color:#d35400}
.PopularPosts ul li:nth-child(7){background-color:#3498db}
.PopularPosts ul li:nth-child(8){background-color:#2980b9}
.PopularPosts ul li:nth-child(9){background-color:#ea6153}
.PopularPosts ul li:nth-child(10){background-color:#c0392b}
.PopularPosts .item-thumbnail{margin:0}
.PopularPosts .item-snippet{font-size:11px}

.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{margin:0;padding:0;list-style:none;border:none;background:none;outline:none}
.PopularPosts ul{margin:.5em 0;list-style:none;color:#000;counter-reset:num}
.PopularPosts ul li img{display:block;margin:0 .5em 0 0;width:50px;height:50px;float:left}
.PopularPosts ul li{background-color:#eee;margin:0 10% .4em 0 !important;padding:.5em 1.5em .5em .5em !important;counter-increment:num;position:relative}
.PopularPosts ul li:before,.PopularPosts ul li .item-title a,.PopularPosts ul li a{font-weight:400;color:#000!important;text-decoration:none}
.PopularPosts ul li:before{content:counter(num)!important;display:block;position:absolute;background-color:#333;color:#fff!important;width:22px;height:22px;line-height:22px;text-align:center;top:0;right:0;padding-right:0!important}
.PopularPosts ul li:nth-child(1){background-color:#A51A5D;margin-right:1%!important}
.PopularPosts ul li:nth-child(2){background-color:#F53477;margin-right:2%!important}
.PopularPosts ul li:nth-child(3){background-color:#FD7FAA;margin-right:3%!important}
.PopularPosts ul li:nth-child(4){background-color:#FF9201;margin-right:4%!important}
.PopularPosts ul li:nth-child(5){background-color:#FDCB01;margin-right:5%!important}
.PopularPosts ul li:nth-child(6){background-color:#DEDB00;margin-right:6%!important}
.PopularPosts ul li:nth-child(7){background-color:#89C237;margin-right:7%!important}
.PopularPosts ul li:nth-child(8){background-color:#44CCF2;margin-right:8%!important}
.PopularPosts ul li:nth-child(9){background-color:#01ACE2;margin-right:9%!important}
.PopularPosts ul li:nth-child(10){background-color:#94368E;margin-right:10%!important}
.PopularPosts .item-thumbnail{margin:0}
.PopularPosts .item-snippet{font-size:11px}
.widget-content ul li{margin:0;padding:6px 0;border-bottom:1px solid #ededed}
.widget-content ul li:last-child{border-bottom:medium none!important}
.widget-content ul li a{color:#333}
.widget-content ul li a:hover{color:#C80441}
.item-date{font-size:11px;font-style:italic;font-weight:700;color:#FC0}

.PopularPosts ul{padding:0;margin:0}
.PopularPosts li{display:block;padding:3px 25px!important;margin:5px 0 0 20px;position:relative;border:1px solid #00aeef;transition:all .15s}
.PopularPosts a{color:#333;font-weight:700}
.PopularPosts li:before{content:"f0c1";position:absolute;top:6%;left:-5%;background:#00aeef;padding:10px;border-radius:50%;height:12px;width:12px;font:normal normal normal 14px/1 FontAwesome;color:#fff;text-align:center;border:1px solid #00aeef}
.PopularPosts .item-snippet{text-align:left;margin-bottom:3px;cursor:default;font-size:11px}
.PopularPosts .item-title{text-align:center}
.PopularPosts li:hover{background:#00aeef;color:#fff;border:1px solid #d8d9da}
.PopularPosts li:hover a{color:#fff}
.PopularPosts li:hover:before{border:1px solid #f5f8fa}
.item-content .item-thumbnail{display:none}

#PopularPosts4 ul li:hover{
background-color: #ffffff;
}
#PopularPosts1 ul li{border-bottom:2px dotted #999999;}
#PopularPosts1 ul li .item-thumbnail{-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}
#PopularPosts1 ul li .item-thumbnail:hover{
-webkit-transform: rotate(-17deg);
-moz-transform: rotate(-17deg);
-o-transform: rotate(-17deg);
}
#PopularPosts1 ul li .item-title {color:#fff;}
#PopularPosts1 ul{margin:0;padding:5px 0;list-style-type:none}
#PopularPosts1 ul li{position:relative;margin:5px 0;border-bottom:1px dashed #ffffff;padding:10px}
#PopularPosts1 ul li:first-child{background:#eb1f0a;width:90%}
#PopularPosts1 ul li:first-child:after{content:"1"}
#PopularPosts1 ul li:first-child + li{background:#0ddb25;width:90%}
#PopularPosts1 ul li:first-child + li:after{content:"2"}
#PopularPosts1 ul li:first-child + li + li{background:#0d6edb;width:90%}
#PopularPosts1 ul li:first-child + li + li:after{content:"3"}
#PopularPosts1 ul li:first-child + li + li + li{background:#eeac0f;width:90%}
#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}
#PopularPosts1 ul li:first-child + li + li + li + li{background:#7d0fee;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}
#PopularPosts1 ul li:first-child + li + li + li + li + li{background:#e30d31;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"}
#PopularPosts1 ul li:first-child:after,#PopularPosts1 ul li:first-child + li:after,#PopularPosts1 ul li:first-child + li + li:after,#PopularPosts1 ul li:first-child + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li:after{position:absolute;top:20px;right:-15px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY4lI_AZqVlunADt4szoR2L2AvQh6ys-4UC8LqM2vV6VJWgEvJgheJSehveHXGEjxSAIU0iSYOgwwdF-DGQJPBgwknQrTIBOhVQjiWnr7TotKn-xaQh6Wd7iml542ZmeRTyaMN5j0-ogEy/s1600/waved-circle.png) no-repeat; width:32px;height:32px;text-align:center;font-size:15px; padding-top:13px; font-weight: bold; color:#ffffff;}
#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:40px;height:40px; border-radius: 5px; border: 2px solid #ffffff;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);box-shadow: 0 1px 2px rgba(0, 0, 0, .4);}
#PopularPosts1 ul li a{font-size:12px;color:#fff;text-decoration:none}
#PopularPosts1 ul li a:hover{color:#e3dede;text-decoration:none}
#PopularPosts1 {
margin-left: 20px;
}
#PopularPosts1 h2 {color:white;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNR9z_U9u5ZL4IwahaMlUMbOyLEuNyxtJmaBReVwJHePuxMWOjXR4IRm6K5qR1u6QZM0gRea5U8m5b1AIlGPLEATmJa_ouqxOeU0cFK16KFfBhc-LDWzVVjj0gbCdPMAv4Z8zrxz4MjHtU/s1600/layer2.png) no-repeat;
height:30px;
width: 287px;
margin-left:-5px;
padding-top:10px;
font-size:18px;
text-align: center;
}

.sidebar .PopularPosts ul {
padding: 0;
margin: 0;
}
.sidebar .PopularPosts .item-thumbnail a {
clip: auto;
display: block;
height: auto;
overflow: hidden;
}
.sidebar .PopularPosts .item-thumbnail {
width: 130px;
height: 130px;
border-right: 5px solid #fff;
margin: 0px 10px 0px 0px !important;
position: relative;
}
.sidebar .PopularPosts .item-thumbnail img {
position: relative;
height: 100%;
width: 100%;
object-fit: cover;
}
.sidebar .PopularPosts ul li {
float: left;
margin-bottom: 5px;
max-height: 130px;
min-width: 250px;
overflow: hidden;
}
.sidebar .PopularPosts ul li:first-child {
background: #D9EDF7;
}
.sidebar .PopularPosts ul li:first-child + li{
background: #F2DEDE;
}
.sidebar .PopularPosts ul li:first-child + li + li {
background: #DFF0D8;
}
.sidebar .PopularPosts ul li:first-child + li + li + li {
background: #FFEEBC;
}
.sidebar .PopularPosts ul li:first-child + li + li + li + li{
background: #E0E0E0;
}
.sidebar .PopularPosts .item-title {
font: 13px 'Oswald', sans-serif;
text-transform: uppercase;
padding: 10px 5px 10px;
}
.sidebar .PopularPosts .item-title a {
color: #000;
text-decoration: none;
}
.sidebar .PopularPosts .item-snippet {
font: 13px "Times New Roman",Times,FreeSerif,serif;
padding-right: 5px;
}
.sidebar .PopularPosts .widget-content ul li {
padding: 0px 5px 0px 0px!important;
}

البحث عن
<body>
فوقه
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>//<![CDATA[
$(document).ready(function() {
var tbn = 150;
$('#PopularPosts1').find('img').each(function(n, image){
var image = $(image);
image.attr({src : image.attr('src').replace(/s\B\d{2,4}/,'s' + tbn)});
image.attr('width',tbn);
image.attr('height',tbn);
});
});
//]]></script>

هذا
.sidebar .popular-posts ul {
counter-reset: popcount;
margin: 0;
padding: 0;
}
.sidebar .popular-posts ul li:first-child {}
.sidebar .popular-posts ul li {
font-family:'Oswald','Open Sans','Helvetica Neue',Arial,Tahoma,sans-serif;
height: 130px;
list-style: none !important;
overflow: hidden;
padding: 0 !important;
position: relative;
margin: 2px;
border: 0;
width: 48%;
float: left;
}
.sidebar .PopularPosts .item-thumbnail {margin: 0; width: 100%;}
.sidebar .PopularPosts ul li img {
display: block;
float: left;
padding: 0;
width: 100%;
height: 130px;
-webkit-transition-duration: 1.0s;
-moz-transition-duration: 1.0s;
-o-transition-duration: 1.0s;
transition:1.0s;
}
.sidebar .PopularPosts ul li img:hover {
-webkit-transform:scale(1.06);
-moz-transform:scale(1.06);
-o-transform:scale(1.06);
transform:scale(1.06);
overflow: hidden;
}
.sidebar .PopularPosts .item-title {
bottom:0;
left: 0;
right: 0;
padding-bottom: 0;
position: absolute;
z-index: 999;
}
.sidebar .PopularPosts .item-title a {
background: rgba(32, 32, 32, 0.77);
color: #FFFFFF;
display: block;
font-size: 12px;
line-height: normal;
padding: 5px 0px 2px 5px;
text-transform: capitalize;
transition: all .4s ease-in-out;
}
.sidebar .popular-posts ul li:hover .item-title a {
color: rgba(255, 255, 255, 1);
background: rgba(231, 76, 60, 0.88);
text-decoration: none;
}
.sidebar .popular-posts ul li:before {
background: rgba(255, 252, 8, 1);
color: #000;
content: counter(popcount, decimal);
counter-increment: popcount;
float: left;
font-size: 14px;
line-height: 20px;
list-style-type: none;
padding: 0px 8px 1px 1px;
border-radius: 0px 0px 10px 0px;
position: absolute;
top: 0;
z-index: 4;
border: solid #FFF;
border-width: 0px 2px 2px 0px;
}

او هذا
.sidebar .popular-posts ul {
counter-reset: popcount;
margin: 0;
padding: 0;
}
.sidebar .popular-posts ul li:first-child {}
.sidebar .popular-posts ul li {
font-family: "Oswald",sans-serif;
height: 130px;
font-weight: bold;
list-style: none !important;
overflow: hidden;
padding: 0px !important;
position: relative;
margin: 2px;
border: 0;
width: 100%;
float: left;
}
.sidebar .PopularPosts .item-thumbnail {margin: 0; width: 100%;}
.sidebar .PopularPosts ul li img {
display: block;
float: left;
padding: 0;
width: 100%;
height: 130px;
-webkit-transition-duration: 1.0s;
-moz-transition-duration: 1.0s;
-o-transition-duration: 1.0s;
transition:1.0s;
}
.sidebar .PopularPosts ul li img:hover {
-webkit-transform:scale(1.06);
-moz-transform:scale(1.06);
-o-transform:scale(1.06);
transform:scale(1.06);
overflow: hidden;
}
.sidebar .PopularPosts .item-title {
bottom:0;
left: 0;
right: 0;
padding-bottom: 0;
position: absolute;
z-index: 999;
}
.sidebar .PopularPosts .item-title a {
background: rgba(32, 32, 32, 0.77);
color: #FFFFFF;
display: block;
font-size: 16px;
font-weight: bold;
line-height: normal;
font-family: "Oswald",sans-serif;
padding: 10px 0px 5px 10px;
text-transform: capitalize;
transition: all .4s ease-in-out;
}
.sidebar .popular-posts ul li:hover .item-title a {
color: rgba(255, 255, 255, 1);
background: rgba(231, 76, 60, 0.88);
text-decoration: none;
}
.sidebar .popular-posts ul li:before {
background: rgba(255, 252, 8, 1);
color: #000;
content: counter(popcount, decimal);
counter-increment: popcount;
float: left;
font-size: 14px;
line-height: 20px;
list-style-type: none;
padding: 0px 8px 1px 1px;
border-radius: 0px 0px 10px 0px;
position: absolute;
top: 0;
z-index: 4;
border: solid #FFF;
border-width: 0px 2px 2px 0px;
}

.PopularPosts .item-title{font-weight:bold;padding-bottom:0.2em;text-shadow:0px 1px 0px #fff;}
.PopularPosts .widget-content ul li{padding:0.7em 0;background:none}
.PopularPosts img{border: 2px solid #FFF;border-radius: 10px;-webkit-border-radius: 10px;-moz-border-radius: 10px;-o-border-radius: 10px;padding-right: 0em;height: 5.4em;width: 5.6em;box-shadow: 0px 0px 6px rgba(14, 21, 34, 1);-webkit-transition: all 0.5s ease;}
.PopularPosts img:hover {-webkit-transform: rotate(360deg);}
.PopularPosts .item-thumbnail {margin: 0 5px 0px 5px;}

صفحات هايف / وسلامتكم

Share on Google Plus

صاحب المدونه : صفحات هايف

اهلا وسهلا فيكم معنا بالمدونه البسيطه ""
    تعليق المدون
    تعليق الفيسبوك

0 التعليقات :

إرسال تعليق

الاشتراك في: تعليقات الرسالة ( Atom )