منتدى الدعم العربي لمنتديات أحلى منتدى
مرحبا بك في منتدى دعم منتديات AhlaMontada

لتتمكن من الإستمتاع بكافة ما يوفره لك هذا المنتدى من خصائص, يجب عليك أن تسجل الدخول الى حسابك في المنتدى. إن لم يكن لديك حساب بعد, نتشرف بدعوتك لإنشائه.


انشاء منتدى مجاني شبيه بهذا المنتدى

كيف يمكنني فعل هذا؟

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل

كيف يمكنني فعل هذا؟

مُساهمة من طرف فيروسان في الجمعة 15 ديسمبر 2017 - 17:27

السَّــلامُ عليـكُم و رحمة الله و بركاته
سؤال: كيفَ يُمكنني فعل هذا كما في الصورة تماماً
للتوضيح أكثر هذا منتدى يطبّق هذه الفكرة هنا
رابط منتدآي هنا
avatar
فيروسان



ذكر
عدد المساهمات : 17
معدل النشاط : 206
السُمعة : 0

http://love-anime-g.ahlamontada.com/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: كيف يمكنني فعل هذا؟

مُساهمة من طرف H U D A في الجمعة 15 ديسمبر 2017 - 18:15

مرحبا ,

هذا شريط الصور المتحركة 

تفضل الكود :

الكود:
<table border="1" width="100%">
  <tr>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
  </tr>
</table>

المكان وضع الكود :
التشكيلات العامة أو الاعلانات الخاصة .
avatar
H U D A
احلى مساعد
احلى مساعد

انثى
عدد المساهمات : 150
معدل النشاط : 198
السُمعة : 2

http://pubdalil.yoo7.com/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: كيف يمكنني فعل هذا؟

مُساهمة من طرف فيروسان في الجمعة 15 ديسمبر 2017 - 22:13

@H U D A كتب:مرحبا ,

هذا شريط الصور المتحركة 

تفضل الكود :

الكود:
<table border="1" width="100%">
   <tr>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
      <td><img border="0" src="ضع هنا رابط الصوره "></td>
   </tr>
</table>

المكان وضع الكود :
التشكيلات العامة أو الاعلانات الخاصة .
أهـلاً
شكـراً لكِ و لكـن الكود لم ينجـح معي و لم تظهـر لي سوى مجموعة من الصّور المختلطـة
أردتُهـا في الصورة تماماً
avatar
فيروسان



ذكر
عدد المساهمات : 17
معدل النشاط : 206
السُمعة : 0

http://love-anime-g.ahlamontada.com/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: كيف يمكنني فعل هذا؟

مُساهمة من طرف omarpop23 في السبت 16 ديسمبر 2017 - 23:07

ضع الكود التالي في نهاية قالب الـ overall_header
الكود:
<style>
.titel-slide,
.pagin7ation a,
a.prev,
a.next,
.nav-tab {
    background-color: #444
}
.mr {
    border-right: 3px solid #5490cc
}
.ward {
    border: 1px solid #5490cc
}
.site_stats_bar li span {
    border-bottom: 2px solid #5490cc
}
.image_carousel {
    padding-right: 3px;
    position: relative
}
.image_carousel a {
    display: block;
    float: left
}
.image_carousel img {
    border: 1px solid #ccc;
    background-color: #fff;
    padding: 6px;
    margin: 5px;
    display: block;
    float: left
}
.image_carousel img:hover {
    border: 1px solid #DDD;
    -moz-box-shadow: 0 1px 5px #555;
    -webkit-box-shadow: 0 1px 5px #555;
    box-shadow: 0 1px 5px #555
}
.image_carousel:hover > a.prev {
    overflow: visible;
    opacity: 1;
    left: 20px
}
.image_carousel:hover > a.next {
    overflow: visible;
    opacity: 1;
    right: 20px
}
a.prev,
a.next {
    overflow: hidden;
    opacity: 0;
    cursor: pointer;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease
}
a.prev {
    background-image: url(http://store1.up-00.com/2017-01/1484068956722.png);
    background-repeat: no-repeat;
    background-color: #D34A21;
    width: 42px;
    height: 40px;
    display: block;
    position: absolute;
    top: 60px;
    left: -32px;
    border-radius: 20px
}
a.next {
    background-image: url(http://store1.up-00.com/2017-01/1484068956661.png);
    background-repeat: no-repeat;
    background-color: #D34A21;
    width: 40px;
    height: 40px;
    display: block;
    position: absolute;
    top: 60px;
    right: -32px;
    border-radius: 20px
}
a.prev:hover,
a.next:hover {
    opacity: .7!important
}
a.prev span, a.next span {
    line-height: 40px;
    text-align: center;
    color: #FFF;
    margin: 0 auto;
    font-weight: bold;
    display: block;
    direction: ltr;
}
.pagin7ation {
    text-align: center
}
.pagin7ation a {
    width: 20px;
    height: 20px;
    margin: 0 5px 0 0;
    display: inline-block;
    float: none;
    border-radius: 20px
}
.pagin7ation a.selected {
    background-position: -25px -300px;
    cursor: default;
    background-color: #D34A21
}
.pagin7ation a span {
    display: none
}
  .caroufredsel_wrapper {
    right: auto !important;
}
</style>

<div class="image_carousel">
<div class="caroufredsel_wrappers" style="position: relative; top: auto; right: auto; bottom: auto; left: auto;height: 174px; margin: 0px; overflow: hidden;">
  <div id="foo1" style="text-align: left; float: none; position: absolute; top: 0px; left: 0px; margin: 0px; width: 4880px; height: 174px;">
      <!-- المجموعة الأولي -->
      <a href="http://www.a7la-anime.com/t20343-topic">
      <img src="http://i.imgur.com/RxyQec8.png" width="220" height="150" />
      </a>
      <a href="http://www.a7la-anime.com/t20956-topic">
      <img src="http://i.imgur.com/utXbqy8.png" width="220" height="150" />
      </a>
      <a href="http://www.a7la-anime.com/t20927-topic">
      <img src="http://i.imgur.com/Pai7RWt.png" width="220" height="150" />
      </a>
      <!-- المجموعة الثانية -->
      <a href="http://www.a7la-anime.com/t20333-topic">
      <img src="http://i.imgur.com/8kjsl3P.png" width="220" height="150" />
      </a>
      <a href="http://www.a7la-anime.com/t20265-topic">
      <img src="http://i.imgur.com/4jPaW2P.png" width="220" height="150" />
      </a>
      <a href="http://www.a7la-anime.com/t20347-topic">
      <img src="http://i.imgur.com/ksNjicT.png" width="220" height="150" />
      </a>
  </div>
</div>  <div class="clearfix"></div>
      <a class="prev" id="foo1_prev" href="#" style="display: block;"><span><</span></a><a class="next" id="foo1_next" href="#" style="display: block;"><span>></span></a>
      <div class="pagin7ation" id="foo1_pag" style="display: block;"><a href="#" class="selected"><span>1</span></a><a href="#" class=""><span>2</span></a></div>
<script src="https://rawgit.com/Deve-Net/style/master/jquery.carouFredSel.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('#foo1').carouFredSel({
        auto: {
            pauseDuration: 5000,
            delay: 375
        },
        prev: '#foo1_prev',
        next: '#foo1_next',
        pagination: "#foo1_pag",
    });
    $('#foo2').carouFredSel({
        auto: {
            pauseDuration: 5000,
            delay: 375
        },
        prev: '#foo2_prev',
        next: '#foo2_next',
        pagination: "#foo2_pag",
    });
});
</script>
avatar
omarpop23
احلى مساعد
احلى مساعد

ذكر
عدد المساهمات : 1140
معدل النشاط : 3326
السُمعة : 123

http://devs.ahlamontada.com

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: كيف يمكنني فعل هذا؟

مُساهمة من طرف H U D A في الثلاثاء 26 ديسمبر 2017 - 14:18

مر على الموضوع اسبوع تقريباً , هذه يعني ان الموضوع تم حلة او أهملت من صاحب المشكلة رجاء في حال كانت لديك المشكلة مستمر او اي استفسار اخر قم بفتح موضوع جديد سيتم غلق الموضوع & يرسل الى الأرشيف
يرجى مراجعة : قوانين منتدى الدعم
avatar
H U D A
احلى مساعد
احلى مساعد

انثى
عدد المساهمات : 150
معدل النشاط : 198
السُمعة : 2

http://pubdalil.yoo7.com/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة


 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى