This website requires JavaScript to deliver the best possible experience.

Carousel بسيط
و متجاوب.

عرض
يوفر لك Hooper إنشاء carousel sliders فريدة والتي تتناسب مع الأحجام المختلفة، مع تكوينات وإعدادات متعددة لتكوين شريط التمرير الخاص بك.

المميزات

خفيف

تم بناؤه باستخدام vanilla JavaScript وليس jQuery أو حتى dependencies.

استجابة كاملة

استمتع من خلال Hooper بمنافذ عرض متعددة وسيناريوهات مختلفة، حيث يتنوع و يتناسب مع الأحجام المختلفة.

يدعم اللمس

تم مراعاة أجهزة الجوال أثناء تصميم Hooper، بالإضافة إلى إجراءات السحب التى تتم عبر الماوس لأجهزة الكمبيوتر.

SVG جاهزة

يعمل Hooper مع SVGs لرموز التنقل المخصصة أيضًا؛ لتوفير تجربة أكثر سلاسة.

سلاسة الانتقالات

يوفر Hooper تجربة انتقالات بسيطة بين أشرطة التمرير، ويمكنك ضبط الانتقالات الخاصة بك بسهولة.

التوافق مع المتصفحات

يتوافق Hooper مع جميع المتصفحات كما أنه يوفر نفس الخبرة المتناغمة.

التثبيت
والاستخدام

npm install hooper
# or use yarn
yarn add hooper

# Usage
<template>
  <hooper>
    <slide>
      slide 1
    </slide>
    <slide>
      slide 2
    </slide>
    ...
  </hooper>
<template>

<script>
  import { Hooper, Slide } form 'hooper';

  export default {
    name: 'App',
    components: {
      Hooper,
      Slide
    }
  }
</script>

حرِك الصور
بسهولة.

ابدأ الآن.