سلايدر تلقائي وخفيف إحترافي

السلام عليكم ..

أقدم لكم أحبابي متابعي مدونة فري ويب سلايدر إحترافي كالمستخدم في مدونتنا المتواضعة ..

هذا السلايدر له مميزات جميلة ومنها أنه خفيف عكس السلايدرات الأخرى + أنه يعرض 12 موضوع من أحدت المواضيع بالمدونة ويعرضها تلقائيا دون الحاجة لوضع الروابط داخله .. ويمكنك وضعه في أي مكان عن طريق كود واحد .. كما أنه متوافق مع جميع القوالب بدون استتناء .. 

العيب الوحيد فيه هو أنه لا يشتغل على متصفح موزيلا .

نأتي لطريقة الإضافة :

مباشرة من التخطيط إفتح أداة Html/Javascript 

وأضف الكود التالي بها :

إضغط مرتيين لتحديد الكل

<style>
/* Css Slider Posts by bloggxp.com */
#featured-wrap {position: relative;height: 175px;margin: 0 auto;border-radius: 4px;}
#featured {border: 0;outline: none;position: relative;width: 890px;height: 150px;overflow: hidden;top: 10px;margin: 0 auto;}
.datex {display: none;}
#featured ul{width:9999px}
#featured ul,#featured li{list-style:none;padding:0;margin:0;overflow:hidden}
#featured li {width: 150px;display: inline-block;float: left;height: 150px;background: #fff;}
.thumb-featured {width: 130px;height: 100px;margin: 5px auto;border: 1px solid #fff;}
.thumb-featured img {display: block;width: 134px;height: 94px;border: 1px solid #ddd;padding: 2px;cursor: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigFNX_6WZTX1-9jx6rqloMC0CeJA0-YmXrfw0W9DeWqpIU-mkQZNsXKNbF2I8BBHFxByp1zgoxdORrHdCCBZmSTiTtEeQOiY_yc4CVkXkmsE6dU1KAqOoTczMr3HwGXCdOvRVnWtOLlN4/s1600/Untitled-2.png),pointer;-moz-transition: all .3s ease 0s;}
.title-featured {text-align: center;position: relative;margin: 0 4px;font: 10px Electrolize,ge_dinar_oneregular;}
.title-featured a {color: #555;}
.title-featured h4{overflow:hidden}
.arrow {position: absolute;display: block;width: 32px;height: 32px;top: 60px;text-indent: -9999px;}
.arrow.back {left: 13px;background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLqO03RvEnorwSuJRppCnntoVQ-AqwJUrvNe_brPl1iwYszHZfrRQXbKGq9BOH4DYpQTbCdMIGIoigNcCLf1uoFWK-MF4_v52U3ceisIxs7-nYZKtcmpmxgu0H3EoDNC-VeuFJIo2D9Ek6/s1600/lefthm.png)no-repeat;}
.arrow.forward {background-position: 100% 50%;right: 10px;background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFW98-VFy_Gaziw5T2TvsvqYEIrQHXVtkPuQaUL_gBMjVcHEn8cXv-dQ92dQ_detRqtZQW6yW_E0AkvODFMIgmliF2I0rmd-7rrHTuB0EgBxKr_EiUNQmNatvMjogjaaJM2Qx17XA4pSn2/s1600/righthm.png)no-repeat;}
span.slideloading{text-indent:-9999px;margin:50px auto;font-family:Electrolize,ge_dinar_tworegular}
</style>
<div id='featured-wrap'>
<div id='featured'>
<span class='slideloading'>جاري التحميل ...</span>
</div>
</div>
<script src='https://ar1web-com.googlecode.com/svn/Hm/slider-iHussam.js'/>

كما يمكنكم وضع السلايدر من داخل القالب عبر تفكيك الكود ووضع كود CSS في skin وكود HTML في ال body والسكريبت في الهيد..

أي مشكلة أو إستفسار يمكنك دائما وضع تعليق ونحن رهن إشارتك.