كيفية اضافة سلايت شو الى المواضيع الاخيره بتقنية hd

السلام عليكم اليوم
شرح كيفي انشاء سلاية تلقائي في المدونه طريقه سهله تابع الفيديو










الكواد من هنا



<style type="text/css">

#slides *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}

#slides ul,#slides li{padding:0;margin:0;list-style:none;position:relative}

#slides ul{height:250px}

#slides li{width:49.9%;height:100%;position:absolute;display:none}

#slides li:nth-child(1), #slides li:nth-child(2), #slides li:nth-child(3), #slides li:nth-child(4){display:block}

#slides li:nth-child(1){left:0;top:0}

#slides li:nth-child(2){left:50.1%;width:24.8%;height:49.8%}

#slides li:nth-child(3){left:75.2%;width:24.8%;height:49.8%}

#slides li:nth-child(4){left:50.1%;top:50.2%;height:49.9%}

#slides a{display:block;width:100%;height:100%;overflow:hidden}

#slides img{display:block;width:100%;height:100%;border:0;padding:4px;background-color:#0097BD;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}

#slides .overlayx{width:100%;height:100%;position:absolute;z-index:2;background-image:url(http://softglad.at.ua/images/fadebg.png);background-position:50% 50%;background-repeat:repeat-x;border:4px solid #00BD79;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}

#slides h4{position:absolute;bottom:30px;margin:0;font-size:18px;font-family:Arial;left:0;padding:0 10px;color:white;z-index:3;line-height:20px;font-weight:normal}

#slides li:nth-child(2) h4,#slides li:nth-child(3) h4{font-size:13px;line-height:15px}

#slides .label_text{font-size:9px;color:white;bottom:10px;z-index:3;left:10px;font-family:Verdana,Geneva,sans-serif;position:absolute}

#slides li:nth-child(2) .autname,#slides li:nth-child(3) .autname{display:none}

#slides .overlayx,#slides 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}

#slides li:hover .overlayx{-ms-filter:"progid:DXImageTransform.Microsoft. Alpha(Opacity=10)";filter:alpha(opacity=10);-khtml-opacity:0.1;-moz-opacity:0.1;opacity:0.1}

#buttons{margin: 5px auto;text-align: center;background:#00BD79;width: 10%;}

#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}

@media only screen and (max-width:600px){

  #slides ul{height:600px}

  #slides li:nth-child(1){width:100%;height:49.8%}

  #slides li:nth-child(2){top:50.2%;height:24.8%;left:0;width:49.8%}

  #slides li:nth-child(3){left:50.2%;top:50.2%;width:49.8%;height:24.8%}

  #slides li:nth-child(4){left:0;top:75.3%;height:24.8%;width:100%}

}

</style>

<div id="featuredpost"></div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>

<script src="http://softglad.at.ua/widgets/slider.js" type="text/javascript"></script>

<script type='text/javascript'>

//<![CDATA[

$(document).ready(function () {

FeaturedPost({

blogURL:"http://akak2014.blogspot.com/",

MaxPost:8,

idcontaint:"#featuredpost",

ImageSize:300,

interval:5000,

autoplay:true,

tagName:false

});

});

//]]>

</script>







معا الملاحضة غير رابط المدونه





تابع الشرح من هنا

I'm reading: كيفية اضافة سلايت شو الى المواضيع الاخيره بتقنية hd

بقلم أسامة بويردن

أنا من المغرب، احب أن أضع كل ما أعرف من معلومات حول الحاسوب ولاأبخل به عليكم، وخطرت لي فكرة عمل مدونة تضم كل المجالات التعليمية للكومبيوتر التي أستطيع إفادتكم بها، فأرجوا ان لاتبخلوا علي أيضا بمتابعتكم لمواضيعي كما ان تعليقاتكم تهمني وتزيد من عطائي لكم إخوتي الكرام وأي استفسار ان موجود وشكرا

قسم :