لاحلى منتدى وللمدونات اليكم الان وحصريا سلايد شو slide show لاخر مواضيعك او المواضيع الاكثر مشاهدة بشكل رائع جدا

موقع جنتل الاردن هو عبارة عن فكرة بسيطة جدا مواضيع نطرحها نؤلف نترجم ونقتبس كل ذلك سبيلا في خدمة القارئ العربي
 
الرئيسيةس .و .جمكتبة الصوربحـثالتسجيلدخول

لاحلى منتدى وللمدونات اليكم الان وحصريا سلايد شو slide show لاخر مواضيعك او المواضيع الاكثر مشاهدة بشكل رائع جدا

الموضوع السابق الموضوع التاليمركز رفع الصور
Posted By

Moh'd S Hammoudeh


انشرالموضوع
الرد عن طريق الفيس بوك
الابلاغ عن الموضوع




مواقع صديقة
All Tricks And Tips
Entertainment
أضف موقعك هنا
أضف موقعك هنا


صفحات فيسبوكية رائعة
All Tricks And Tips
Entertainment
المحاسبين
موقع جنتل الاردن
أضف صفحتك هنا
أضف صفحتك هنا


صفحتنا الرسمية على الفيس بوك

صفحتنا الرسمية على تويتر



الثلاثاء مايو 14, 2013 10:58 am ساندنا على الفيس بوك  ساندنا على اليوتيوب ساندنا على تويـــــــتر









السلام عليكم

دائما نأتيكم بالأفضل وكل ما هو جديد ,,, اليوم اتينا لكم بسلايد شو slide show أكثر من رائع وفريد من نوعه

في عالم احلى منتدى ويمكن ان تضيفه لمدونتك او منتديات الفي بي


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



اليكم مثال من هنا

http://www.algantel.com/h115-page

الان انت ممكن تسأل نفسك انا ماذا ممكن ان استفيد من هذا السلايد ؟!!

اولا يمكنك مثلا وضع فيه المواضيع الاكثر مشاهدة
ثانيا ممكن انت تعمل مثلا مسابقات او مثلا افضل المواضيع لهذا الاسبوع
ثالثا الكود جافا ويمتاز بالسرعة والتحرك الاجمل

وانت وافكارك

الان طريقة وضع الكود

نذهب الى لوحة الادارة ثم عناصر اضافية ثم إدارة صفحات ال html

ثم تلصق هذا الكود فيها




اقتباس :

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

</div>



<style type="text/css">

/* JavaScript Image Slider By http://www.algantel.com/ */

#mcis {
display: none;
}

#sliderFrame {
position: absolute;
width: 500px;
margin: 0 auto;
border:3px solid #E1E0E2;
}

#ribbon {
width: 111px;
height: 111px;
position: absolute;
top: -4px;
right: -4px;
}

#slider {
width: 500px;
height: 280px;
background: #fff url(https://lh3.googleusercontent.com/-jr3u7sHVNzc/T_9iyf5egvI/AAAAAAAAC9c/jwanynfbt7Y/h120/mdonti-n.blogspot.com-loading.gif) no-repeat 50% 50%;
position: relative;
margin: 0 auto;
box-shadow: 0px 1px 5px 010007;
}

#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: 30px;
z-index: 3;
overflow: hidden;
font-size: 0;
}


div.mc-caption-bg {
background-color: #000000;
}

div.mc-caption {
font: bold 25px/21px traditional arabic ;
color: #ffffff;
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: 290px;
right: 180px;
width: 350px;
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/-XpmNmet2gQE/T_9iZTdKsgI/AAAAAAAAC9U/e5Hto1X5zKc/h120/mdonti-n.blogspot.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);
}
</style>

<script src="http://my-mdonti.googlecode.com/files/js-image-slider.js" type="text/javascript"></script>
<div id="sliderFrame">
<div id="ribbon"></div>
<div id="slider">

<a href="الاخضر"><img src="الاحمر" alt=" شاهد بالصور اصعب 10 مواقف قد تتعرض لها في حياتك "/></a>

<a href="الاخضر"><img src="الاحمر" alt=" هل تعلم ان هناك خمسون موقع لن تتمكن من الوصل اليهم عبر جوجل ايرث "/></a>

<a href="الاخضر"><img src="الاحمر" alt="اجمل 10 اماكن رومانسية للعشاق ... بالصور Top 10 Romantic Destinations"/></a>

<a href="الاخضر"><img src="الاحمر" alt="اختصارات وابتسامات جديدة لشات الفيس بوك ,,, احصل عليها الان وكن الاول "/></a>

<a href="الاخضر"><img src="الاحمر"alt=" حصريا بمعنى الكلمة ... كود جافا رائع جدا ضيف لديك اعلانات او بنرات تتبدل تلقائيا وبشكل رائع اتحدى اذا شاهدته من قبل ... "/></a>
</div></div>
/* JavaScript Image Slider By http://www.algantel.com/ */



الان من الكود السابق نستبدل اللون الاحمر برابط الصورة واللون الاخضر بالرابط الذي تريد الانتقال له عند النقر واللون الازرق بالنص الذي تريد ان يظهر

الان نحفظ هذه الصفحة ال html ونسميها مثلا "أخر المواضيع" وبعد هذه الخطوة إعمل معاينة

للصفحة , يعني افتحها وشاهد ما النتيجة ,,, والان من فوق قم بنسخ الرابط الخاص بالصفحة الي انشأناها ووضعنا فيها الكود السابق واحتفظ به.

والان نروح المكان الي انت تريد ان يظهر بها السلايد ,, طبعا تقدر تضعها في اعلانات الادارة او في البوابة او في اي مكان يقبل لغة html
,,, وتضع فيه الكود التالي

اقتباس :

<iframe marginwidth="0"
src="هنا ضع رابط الصفحة السابقة"
marginheight="0" frameborder="0" height="310" scrolling="no"
width="510"></iframe>

والان قم بتغيير اللون الاحمر الى رابط صفحة ال html الي قمنا بإنشائها واعمل حفظ ومبروك عليك السلايد شو

الاحترافي ...

وبالتوفيق اذا احببت النقل فالرجاء ذكر المصدر موقع جنتل الاردن وشكرا www.algantel.com












جميع المواضيع و الردود تعبر عن رأي صاحبها ولا تعبر عن رأي إداره موقع جنتل الاردن بــتــاتــآ
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 

الموضوع السابق الموضوع التالي
صفحة 1 من اصل 1








جميع الحقوق محفوظة لبوابة جنتل الاردن © 2013