طريقة اضافة سلايد شو اللى مدونتك بسهوولة

اهلا بكم اصدقائي . بعد العديد من الاسئلة حول مشاكل السلايد الشو

اليومم ساقدم لكم كريبت الخاص بالسلايدر

1/ قم بالذهاب الى تخطيط

2/ اضافة اداة

3/ html/java script

4/ تم انسخ كود السكريبت

.ei-slider{position:relative;width:100%;max-width:1000px;height:380px;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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQzp-nK-nvNUoCc38J7DSyP4IsD7tu5hooa4zf9MwOIhBP_OEEbvVD6WEPO96spTOokAUCaNjEE5g_M3-LrgSH3rok0nSZLYOo-ZwThMiBvFwlQG_KX6dbapinCIxBNRLP6LY2lbK4uY0/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 #090707;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:-6%}

.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:#090707}

.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>

$(document).ready(function () {

AutoElasticSlideshow({

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