سلايدر شو جميل
 

نمر لتطبيق الاضافة:

1.اذهب للوحة التحكم الخاصة بمدونك
2. تخطيط.
3.عناصر الصفحة.
3.إضافة أداة.
4.اختار Html/Javascript.
5.أضف الكود التالي:

اقتباس:
display: none;
}
#sliderFrame {
position: relative;
width: 500px;
margin: 0 auto;
border:5px solid #000;
}
#ribbon {
width: 111px;
height: 111px;
position: absolute;
top: -4px;
right: -4px;
}
#slider {
width: 500px;
height: 218px;
background: #fff url(https://lh3.googleusercontent.com/-j...om-loading.gif) no-repeat 50% 50%;
position: relative;
margin: 0 auto;
box-shadow: 0px 1px 5px #999999;
}
#slider img {
position: absolute;
border: none;
display: none;
}
#slider a.imgLink {
z-index: 2;
display: none;
position: absolute;
top: 0px;
right: 0px;
border: 0;
padding: 0;
margin: 0;
width: 100%;
height: 100%;
}
div.mc-caption-bg, div.mc-caption-bg2 {
position: absolute;
width: 100%;
height: auto;
padding: 0;
right: 0px;
bottom: 0px;
z-index: 3;
overflow: hidden;
font-size: 0;
}
div.mc-caption-bg {
background-color: black;
}
div.mc-caption {
font: bold 15px/21px Arial;
color: #EEE;
z-index: 4;
padding: 10px 0;
text-align: center;
}
div.mc-caption a {
color: #FB0;
}
div.mc-caption a:hover {
color: #DA0;
}
div.navBulletsWrapper {
top: 250px;
right: 190px;
width: 150px;
background: none;
padding-right: 20px;
position: relative;
z-index: 5;
cursor: pointer;
}
div.navBulletsWrapper div {
width: 11px;
height: 11px;
background: transparent url(https://lh3.googleusercontent.com/-X...com-bullet.png) no-repeat 0 0;
float: right;
overflow: hidden;
vertical-align: middle;
cursor: pointer;
margin-left: 11px;
_position: relative;
}
div.navBulletsWrapper div.active {
background-position: 0 -11px;



}
#slider {
transform: translate3d(0,0,0);
-ms-transform: translate3d(0,0,0);
-moz-transform: translate3d(0,0,0);
-o-transform: translate3d(0,0,0);
-webkit-transform: translate3d(0,0,0);
}







http://vb.ma7room.com/رابط الصورة 1
http://vb.ma7room.com/رابط الصورة 2
http://vb.ma7room.com/رابط الصورة 3
http://vb.ma7room.com/رابط الصورة 4
http://vb.ma7room.com/رابط الصورة 5



6.قم بتغير ماكتب بالأزرق بروابط المواضيع الذي تريدها أن تظهر في Slideshow.
قم بتغير ماكتب بالأحمر بصور المواضيع الذي تريدها أن تظهر في Slideshow .
قم بتغير ماكتب بالبنفسجي بعناوين المواضيع الذي تريدها أن تظهر في Slideshow

ملاحظة هامة:

يجب مراعاة أن تكون أحجام الصور بهذا المقاس 500X216.
يمكنك الإستعانة ببرنامج Paint المدمج في Windows لتعديل أحجام الصور تم ترفعها على سرفر مخصص لهذا الغرض أو من خلال مدونة تجريبية وتنسخ الروابط.