| home |
true |
| heroImage |
hooper.svg |
| actionText |
Getting Started → |
| actionLink |
/getting-started |
| features |
| title |
details |
🧁 Simple |
Easily customizable thorough rich API and addons. |
|
| title |
details |
♿ Accessible |
Robust structure and Touch, Keyboard, Mouse Wheel, and Navigation support. |
|
| title |
details |
⬅ RTL |
Auto detect direction, Fully true RTL layout support. |
|
| title |
details |
↕ Vertical |
Supports vertical sliding, to cover all your use cases. |
|
| title |
details |
📱 Responsive |
Responsive breakpoints, to apply custom configurations for each screen size. |
|
| title |
details |
🖖 Vue.js |
Optimized to work with Vue framework, not a wrapper for another library. |
|
|
| footer |
MIT Licensed | Copyright © 2018-present Baianat |
| description |
A customizable accessible carousel slider optimized for Vue |
| meta |
| name |
content |
og:title |
Hooper |
|
| name |
content |
og:description |
A customizable accessible carousel slider optimized for Vue |
|
|
First step is to install it using yarn or npm:
npm install hooper
# or use yarn
yarn add 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>