Lory Carousel Slider ميزات CSS الرسوم المتحركة ودعم اللمس
خارج كل الإضافات دائري على الانترنت لا بد لي من طرف قبعتي ل لوري. انها مثل مفهوم بسيط لكنها بسهولة واحدة من المتزلجون الأقوى على الويب.
ال نسخة مصغرة إجماليات حول 7 كيلو بايت وهي ليست صغيرة ولكن بالتأكيد ليس سيئًا بالنسبة إلى شريط تمرير دائري يعمل باللمس.
يمكنك إضافة هذا البرنامج المساعد إلى أي موقع ويب منذ ذلك الحين يعمل على مسج أو عادي الفانيليا JS. يمكن أن تعمل مع لا التبعيات وهو شيء عظيم للتوافق.
لوري هي أيضا واحدة من الإضافات القليلة التي لا تتحلل في المتصفحات القديمة. انها مدعومة بالكامل في IE10+, والإصدارات الأقدم لا يزال بإمكانها تشغيل شريط التمرير ، فقط بدون رسوم متحركة وإضافات صغيرة.
سيكون لديك ل تفعل كل الترميز البرنامجي نفسك إذا كنت ترغب في إضافة محتوى لكنه بسيط بشكل مدهش. يمكنك تحديد حجم إنشاء كل لوحة ، ومدة التحريك ، وكيفية التعامل مع المتصفحات سريعة الاستجابة.
تحقق من الصفحة الرئيسية لوري ل مصدر الرمز و تفاصيل حول الإعداد.
ابدأ بإضافة مكتبة Lory JS إلى موقعك رئيس الجزء, إما كمكون إضافي مسج أو مكتبة الفانيليا. جميع الإصدارات حاليا استضافت على Cloudflare CDN, لذلك فمن السهل للغاية تضمين نسخة دون أي تنزيلات.
مع تثبيت ملف JavaScript ، سترغب في إنشاء قائمة HTML غير مرتبة مع محتويات الشريحة ، ولكن Lory يأتي مع عدد قليل من الفصول المحددة مسبقا لذلك من الجيد أن العصا مع نموذجهم.
إليكم بعض عينة من الرموز مأخوذة من الريبو الرئيسي لوري جيثب:
- 1
- 2
- 3
- 4
- 5
- 6
الآن في jQuery (أو JS عادي) ، يمكنك ذلك إعداد دعوة وظيفة. يجب أن يبدو شيء مثل هذا:
$ ('. js_slider'). lory (لانهائي: 1) ؛ لاحظ ال غير محدود الخيار هو مجرد واحدة من العديد من الميزات التي يمكنك تخصيصها. ويمكنك دائما تغيير .js_slider فئة لتناسب احتياجاتك.
أثناء تطوير هذا البرنامج المساعد ، ستكون مسؤولاً عن وجود الكثير من أسئلة التخصيص. سأكون في غاية يوصي تصفح الوثائق وهو في أسفل صفحة جيثب.
ربما لا يكون أفضل موقع للمستندات ولكن لحسن الحظ فهي صغيرة جدًا. انت فقط لديك حوالي 10 خيارات لتخصيص وربما 10-12 أحداث مختلفة يمكنك العبث بها. يمكن العثور على هذه المعلومات أيضًا في الجزء السفلي من موقع Lory الإلكتروني ، ولكن من الأسهل بكثير قراءتها على GitHub.
التحديثات ليست متكررة ولكن يمكنك دائمًا القلم طلب القضية على جيثب إذا واجهت مشاكل. إذا كان لديك بالفعل مشكلات في الكود ، فربما يكون لديك وقت أسهل لحلها على Stack Overflow.
وفي كلتا الحالتين ، يمكنك ذلك ابدأ بسرعة كبيرة باستخدام مستندات Cloudflare CDN و GitHub. وإذا كنت تبحث عن عرض حي مع الكود تحقق من هذا الدخول CodePen.
