#1
مدون نشيط
تاريخ التسجيل: Feb 2014
المشاركات: 124
اضافة احدث التدوينات بشكل متحرك - اضافات بلوجر
السلام عليكم ورحمة الله وبركاته
كود PHP:
< style scoped = "" type = "text/css" >
/*trickstoo modified widget of abt slider widget*/
ul . abt - sidebar - slider *{
moz - box - sizing : border - box ;
webkit - box - sizing : border - box ;
box - sizing : border - box ;
ul . abt - sidebar - slider {
font : normal normal 11px embria
}
ul . abt - sidebar - slider , ul . abt - sidebar - slider li {
margin : 0 ;
padding : 0 ;
style : none ;
position : relative
}
ul . abt - sidebar - slider {
width : 100 %;
height : 500px
}
ul . abt - sidebar - slider li {
height : 24.5 %;
position : absolute ;
padding : 0 ;
width : 49.5 %;
float : left ;
overflow : hidden ;
display : none
}
ul . abt - sidebar - slider li : nth - child ( 1 ), ul . abt - sidebar - slider li : nth - child ( 2 ), ul . abt - sidebar - slider li : nth - child ( 3 ), ul . abt - sidebar - slider li : nth - child ( 4 ){
display : block
}
ul . abt - sidebar - slider img {
border : 0 ;
width : 100 %;
height : 100 %} ul . abt - sidebar - slider li : nth - child ( 1 ){ width : 100 %;
height : 49.5 %;
margin : 0 0 2px ;
left : 0 ; top : 0
}
ul . abt - sidebar - slider li : nth - child ( 2 ){ left : 0 ; top : 50 %}
ul . abt - sidebar - slider li : nth - child ( 3 ){ left : 50.5 %; top : 50 %}
ul . abt - sidebar - slider li : nth - child ( 4 ){ width : 100 %; left : 0 ; top : 75 %}
ul . abt - sidebar - slider . overlayx , ul . abt - sidebar - slider li {
webkit - transition : all .4s ease - in - out ;
moz - transition : all .4s ease - in - out ;
o - transition : all .4s ease - in - out ;
ms - transition : all .4s ease - in - out ; transition : all .4s ease - in - out
}
ul . abt - sidebar - slider . overlayx {
width : 100 %;
height : 100 %;
position : absolute ;
z - index : 2 ;
left : 0 ;
top : 0 ;
background - image : url ( http : //1.bp.blogspot.com/-FtnGJHMcWH8/UIV3IE-aaJI/AAAAAAAAGHs/WvLypnWxg5A/s1600/linebg-fade.png);
background - position : 50 % 50 %;
background - repeat : repeat - x
}
ul . abt - sidebar - slider . overlayx , ul . abt - sidebar - slider img {
border : 4px solid black ;
moz - border - radius : 3px ;
webkit - border - radius : 3px ;
border - radius : 3px
}
ul . abt - sidebar - slider li : nth - child ( 1 ) . overlayx {
background - position : 50 % 25 %
ul . abt - sidebar - slider . overlayx : hover {
ms - filter : "progid:DXImageTransform.Microsoft. Alpha(Opacity=10)" ;
filter : alpha ( opacity = 10 );- khtml - opacity : 0.1 ;
moz - opacity : 0.1 ; opacity : 0.1
}
ul . abt - sidebar - slider h4 {
position : absolute ;
bottom : 30px ;
z - index : 2 ;
color : white ;
margin : 0 ;
width : 100 %;
padding : 0 10px ;
line - height : 1.5em ;
font : embria ;
font - weight : normal
}
ul . abt - sidebar - slider li : nth - child ( 1 ) h4 , ul . abt - sidebar - slider li : nth - child ( 4 ) h4 {
font - size : 150 %
ul . abt - sidebar - slider . label_text {
position : absolute ;
bottom : 10px ;
left : 10px ;
z - index : 2 ;
color : white ;
font - size : 90 %}
ul . abt - sidebar - slider li : nth - child ( 2 ) . autname , ul . abt - sidebar - slider li : nth - child ( 3 ) . autname {
display : none
}
buttons {
margin : 5px 0 0
}
buttons a {
display : inline - block ;
text - indent :- 9999px ;
width : 15px ;
height : 25px ;
position : relative
}
buttons a :: before {
content : "" ;
width : 0 ;
height : 0 ;
border - width : 8px 7px ;
border - style : solid ;
border - color : transparent #535353 transparent transparent;
position : absolute ;
top : 50 %;
margin - top :- 8px ; margin - left :- 10px ;
left : 50 %
buttons a . nextx :: before {
border - color : transparent transparent transparent #535353;
margin - left :- 3px
}
style >
div id = "featuredpostside" >
div >
script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type = "text/javascript" > </script>
<script src="https://trickstoo-slider-recent-posts.googlecode.com/svn/trickstoo-slider.js" type="text/javascript"></script>
ضع رابط مدونتك واحفظ العمل
__________________
من مواضيع Blog-Add
02-26-2014, 10:17 PM
اضافة احدث التدوينات بشكل متحرك - اضافات بلوجر
المواضيع المتشابهه
العرض الشجري
