وصف البدو : "العرب يستهلكون القليل القليل من الخضراوات ، إذ إن أطباقهم أعدت من اللحم والأرز والدقيق والزبدة." /// بوركهارت

السبت، 1 مارس 2014

سلايد شو بأخر المشاركات تلقائي لمدونات بلوجر والمواقع أحترافي جميل

سلايد شو بأخر المشاركات تلقائي لمدونات بلوجر والمواقع أحترافي جميل 





صورة السلايدر شو 

السلام عليكم ورحمة الله وبركاته 

أقدم لكم اليوم سلايدر جميل جدا هذا السلايدر يقوم بإظهار اخر الموضيع لمدونات بلوجر والمواقع المستضافة على بلوجر او ورد برس سلايدر خفيف وسهل التركيب 




كيفية اضافة السلايدر الى مدونتك



  • اولا سجل دخول الى مدونتك لوحة التحكم 
  • ثم اضغط على تخطيط وبعدها اضافة أداة 
  • حدد أدوات html/javascript ثم اضف الكود التالي في المكان الذي ترغب بظهور السلايدر فيه


<style scoped="" type="text/css">
.ei-slider{position:relative;width:100%;max-width:1000px;height:250px;margin:0 auto 35px;padding:0;background-color:white}
.ei-slider-loading{width:100%;height:100%;z-index:997;position:absolute;top:0;left:0;background-color:white;text-indent:-9999px;background-image:url(http://2.bp.blogspot.com/-aFHDAB82tQw/UCEoDlHaNOI/AAAAAAAAEUg/J5hyAZvUVxo/s1600/loading.gif);background-position:50% 50%;background-repeat:no-repeat}
.ei-slider-large{height:100%;position:relative;overflow:hidden;margin:0 0 10px;padding:0;border:5px solid #9E0505;border-radius:2px}
.ei-slider-large li{position:absolute;top:0;left:0;overflow:hidden;height:100%;width:100%;list-style:none}
.ei-slider-large li img{width:100%;border:0;padding:0}
.ei-title{position:absolute;right:8%;left:8%;bottom:20%;color:#fff;opacity:0.8}
.ei-title p{text-align:left}
.ei-title h2{font-family:Georgia,Times,"Times New Roman";text-align:right;margin-left:auto;font-size:18px;line-height:20px;color:#b5b5b5;max-width:80%;text-transform:capitalize;background:#000;padding:5px}
.ei-title h2 a{color:white}
.ei-title h2 a:hover{text-decoration:none;color:#9E0505}
.ei-title p{font-family:Verdana,Geneva,sans-serif;margin-left:auto;font-size:11px;line-height:15px;width:85%;clear:both;background:#000;padding:5px 10px;position:relative;left:-5%}
.ei-slider-thumbs{padding:0 0;height:13px;margin:0 auto;width:100%;position:relative}
.ei-slider-thumbs li{position:relative;float:left;height:100%;width:20%;list-style:none}
.ei-slider-thumbs li.ei-slider-element{top:0;left:0;position:absolute;height:100%;z-index:10;text-indent:-9000px;background:#9E0505}
.ei-slider-thumbs li a{display:block;text-indent:-9000px;background:#666;width:100%;height:100%;cursor:pointer;-webkit-box-shadow:0 1px 1px 0 rgba(0,0,0,0.3),0px 1px 0 1px rgba(0,0,0,0.5);-moz-box-shadow:0 1px 1px 0 rgba(0,0,0,0.3),0px 1px 0 1px rgba(0,0,0,0.5);box-shadow:0 1px 1px 0 rgba(0,0,0,0.3),0px 1px 0 1px rgba(0,0,0,0.5);-webkit-transition:background 0.2s ease;-moz-transition:background 0.2s ease;-o-transition:background 0.2s ease;-ms-transition:background 0.2s ease;transition:background 0.2s ease}
.ei-slider-thumbs li a:hover{background-color:#f0f0f0}
.ei-slider-thumbs li img{position:absolute;bottom:50px;opacity:0;z-index:999;width:100%;padding:0;background-color:white;border-radius:2px 2px 0 0;border:0;max-width:100%;height:60px;max-height:70px;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;-ms-transition:all 0.4s ease;transition:all 0.4s ease;-webkit-box-reflect:below 0 -webkit-gradient( linear,left top,left bottom,from(transparent),color-stop(50%,transparent),to(rgba(255,255,255,0.3)) );-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}
.ei-slider-thumbs li:hover img{opacity:1;bottom:13px;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"}
@media only screen and (max-width:479px){
  .ei-slider{height:200px}
  .ei-title{bottom:5%}
  .ei-title h2{font-size:14px;line-height:17px}
}
</style>

<br />
<div id="autoelastic">
</div>
<script src="http://trollvlhcv.googlecode.com/svn/trunk/demo/autoelastic.min.js" type="text/javascript"></script>
<script type="text/javascript">//<![CDATA[
$(document).ready(function () {
AutoElasticSlideshow({
blogURL:"http://alahaywat.blogspot.com",
MaxPost:5,
idcontaint:"#autoelastic",
ImageSize:400,
Summary:100,
animation:'center',
speed:800,
easing:'',
titlesFactor:0.60,
titlespeed:800,
titleeasing:'',
thumbMaxWidth:150,
Interval:3000,
autoplay:true,
pBlank:'http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif',
tagName:false
});
});//]]>
</script>


غير رابط موقعك بموقعي الرابط المشار اليه باللون الاحمر ثم اختر حفظ وشاهد النتائج

المصدر
مدونة مداد الجليد

ليست هناك تعليقات:

إرسال تعليق