مع مجموعة متنوعة من دوارات هناك، والعديد من Mootools كذلك، قررت أن أكتب لا يزال صفي كاروسيل الخاصة، لبعض أسباب وجيهة
1. يريد ميزة الترحيل (لتكون قادرة على القفز شريحة معينة / خطوة في دائري).
2. أراد الحرية مع التنسيب من الأزرار اليسار واليمين / وصلات، حيث من أي وقت مضى لي من فضلك.
3. مزيد من السيطرة على خطوات الشرائح.
أنا لم يتمكن من خلق كاروسيل جديد، مع ميزات أعلاه ... على النحو التالي ... لا تتردد في اقتراح أي تعديلات تقوم سيتطلب!
بلدي على سبيل المثال يبدو مثل هذا ... [ عرض الفيلم ]
عرض تجريبي | تحميل Mootools كاروسيل مع ترحيل الإصدار 1.0 (يتم تنزيله 1988 مرة)
1. دائري ترحيل
يمكنك بسهولة إضافة إلى ترحيل دائري الخاص، وذلك ببساطة من خلال وضع علامة الترحيل، والذي هو parater الماضي مرت أثناء إنشاء مثيل من MooCarousel إلى الحقيقية (أريد الترحيل) أو خطأ (متأكدا يريد ترحيل).
فار carousel1 = جديد MooCarousel ('carousel1_wrapper'، 'carousel1_items_container'، 'carousel1_moveleft'، 'carousel1_moveright'، c_ns، c_sss، صحيح)؛ / / نانوثانية = عدد من الشرائح، ونظام الضمان الاجتماعي خطوة الشريحة = حجم
ويمكن أن فكورسي تغيير هذه النظرة achors ترحيل-N-يشعر كما تريد من خلال تعديل CSS الخاصة بهم.
. carousel_paging {مواءمة النصوص: حق؛ الهامش: 5PX 10px 0 0؛}
. carousel_paging الحالي، carousel_paging الصفحة {الخطوط العريضة: لا شيء؛ العرض:. 15px؛ الطول: 15px؛ خط الطول: 15px؛ مواءمة النصوص: المركز؛ العرض: كتلة، تعويم: غادر؛ خلفية: # D8D8EB؛ هامش: 0 1px 0 0؛ النص الديكور: لا شيء؛}
. carousel_paging أ: تحوم، carousel_paging الحالية {خلفية: # 4D4D9B؛ اللون: # FFFFFF؛}.
حسنا! هناك مشكلة صغيرة الرغم من ذلك، وإذا المراسي ترحيل مجموعة، ثم الحصول على ولدت بعد ذلك دائما عنصر كاروسيل. قررت أنني أريد أن تجعل من ديناميكية أيضا، ولكن بعد ذلك فقط للحفاظ على السيناريو للتطاير من النسب، لتخطي ذلك.
لكنك تعلم جافا سكريبت قليلا، هل يمكن بسهولة تعديل رمز جيل الترحيل في فئة MooCarousel لإرضاء الاحتياجات الخاصة بك.
2. Customising رموز اليسار واليمين
يمكنك تغيير موضع أو الصور أو أي ممتلكات displat من أزرار اليمين واليسار لمجرد اللعب حولها مع CSS. لتكون قادرة على تغيير المواضع من buttoms اليسار واليمين وكان السبب الحقيقي بالنسبة لي أن حق طبقتنا بلدي كاروسيل.
منذ هذه الفئة MooCarousel، يقبل معرف لهذه الأزرار، يمكنك وضع هذه الأزرار في الواقع في أي مكان على الصفحة، وإذا كنت من فضلك ... لا يجب أن تكون في التسلسل الهرمي عنصر، كما هو الحال في بلدي على سبيل المثال.
فار carousel1 = جديد MooCarousel ('carousel1_wrapper'، 'carousel1_items_container'، 'carousel1_moveleft'، 'carousel1_moveright'، c_ns، c_sss، صحيح)؛
CSS
.. carousel_container_l، carousel_container_r {الهامش: 50px 0 0 0؛ الموقف: النسبية؛ العرض: 23px؛ الطول: 20px؛ تعويم: غادر؛ المؤشر: المؤشر؛}
. carousel_container_r {الخلفية الموقف: 0-38px؛}
. carousel_container_l {الخلفية الموقف: 0-58px؛}
3. Customising خطوات الشرائح
ماذا يعني خطواتي SLIDE CUSTOMISING؟
معظم دوارات حرك كامل مع الإطار مرئية. لذلك نقول لكم كان أربعة وحدات (كما هو الحال في عينتي أعلاه)، فإنه ينزلق جميع البنود الأربعة. مع هذا المكون كاروسيل، يمكنك تمرير عدد من الشرائح وحجم الخطوة التي تختارها.
فار carousel1 = جديد MooCarousel ('carousel1_wrapper'، 'carousel1_items_container'، 'carousel1_moveleft'، 'carousel1_moveright'، c_ns، c_sss، صحيح)؛
c_ns = عدد من الشرائح، c_sss خطوة الشريحة = حجم
أيضا، في example1 لي لقد calcuted حجم الشريحة الخطوة، على أساس منطق حيث، وأنا أعرف عددا من البنود، عرض على كل بند والهوامش التي قدمت بعد كل عنصر في CSS بي.
/ * للإحتفال صاخب مخمور 1 * /
فار c1_w = 92؛ العرض البند / / إحتفال صاخب مخمور
فار c1_n = 10؛ عدد / / الإجمالي للعناصر إحتفال صاخب مخمور Comparision
فار c1_pp = 4 / / عدد من إحتفال صاخب مخمور Comparision عناصر perpage
فار c1_marginFactor = 51؛
فار c1_sss = c1_w * c1_pp / / نظام الضمان الاجتماعي خطوة الشريحة = حجم
فار c1_ns parseInt = (((* c1_w c1_n) / c1_sss) + 0.5) / / نانوثانية = عدد الشرائح
c1_sss + = c1_marginFactor / / الشريحة = SSS حجم الخطوة، و 51 للهوامش
المتطلبات: Mootools 1.2
عرض تجريبي | تحميل Mootools كاروسيل مع ترحيل الإصدار 1.0 (يتم تنزيله 1988 مرة)
