Hooper

A customizable accessible carousel slider optimized for Vue

Getting Started →

🧁 Simple

Easily customizable thorough rich API and addons.

♿ Accessible

Robust structure and Touch, Keyboard, Mouse Wheel, and Navigation support.

⬅ RTL

Auto detect direction, Fully true RTL layout support.

↕ Vertical

Supports vertical sliding, to cover all your use cases.

📱 Responsive

Responsive breakpoints, to apply custom configurations for each screen size.

🖖 Vue.js

Optimized to work with Vue framework, not a wrapper for another library.

Quick Start

Installation

First step is to install it using yarn or npm:

npm install hooper

# or use yarn
yarn add hooper

Use Hooper

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

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

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