node package manager
Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »


WIP !!!

Watch progress on 📺🎥 Click 🍿

vue-siema - Lightweight and simple carousel for Vue
This project is based on

⚠️️Warning: vue-siema uses internal v-html be sure to sanitize only use on trusted content!(will change later)



npm install --save vue-siema


Prop Type Default Required
duration Number 200 false
slides Array empty true
easing String 'ease-out' false
perPage Number 1 false
startIndex Number 0 false
draggable Boolean true false
threshold Number 20 false
loop Boolean true false


Name Fires returns
@slideChange Init / Slide changed currentIndex


    <div class="slider">
        <Siema :slides="slides">
   import Siema from 'vue-siema'
   export default {
     name: 'hello',
     data() {
       return {
         sliderIndex: 2,
         slides: [ //⚠️️ Warning: vue-siema uses internal v-html be sure to sanitize! 
           '<img src="" alt="slide">',
           '<img src="" alt="slide">',
           '<img src="" alt="slide">',
           '<img src="" alt="slide">',
           '<img src="" alt="slide">',
           '<img src="" alt="slide">',
     components: {


  • Touch Stuff
  • Dynamically adding/remove Slides
  • Events
  • SSR compatibility (check)
  • Pagination(example)
  • Manual initialize via ref and disable in options when some async content comes and must wait