A carousel plugin based on vuescroll.
Clone or download
Latest commit 3c50896 Jan 18, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
Demo update Jan 1, 2019
build init Dec 20, 2018
dist 0.0.10 Jan 18, 2019
src 0.0.10 Jan 18, 2019
.babelrc init Dec 20, 2018
.gitignore add demo Jan 1, 2019
README.MD 0.0.10 Jan 18, 2019
package.json 0.0.10 Jan 18, 2019
postcss.config.js init Dec 20, 2018

README.MD

vuescroll-carousel

Version License

Introduction

vuescroll-carousel is a carousel plugin based on ^vuescroll@4.9.0.

It seems like swiper. You can see the guide below.

Demo

Get Started

  1. You should install Vue@2.x , vuescroll@4.9.0+ and vuescroll-carousel , and registry the plugins.
 npm i vue vuescroll vuescroll-carousel -S
import Vue from vue;
import vuescroll from vuescroll;
import vuescroll/dist/vuescroll.css;
// import carousel plugin and its css file
import vuescrollCarousel from vuescroll-carousel;
import vuescroll-carousel/dist/index.css;

// reigstry the plugin

Vue.use(vuescroll);
Vue.use(vuescrollCarousel);
  1. Wrap the element and that's all.
<vuescroll-carousel>
  <div v-for="i in 10" :key="i">{{i}}</div>
</vuescroll-carousel>

Props and Api

Props

PropName Default Description
type h h or v. h means scrolling on horizontal direction and v is on vertical direction.
loop true Whether carousel is connected between the end and the end or not.
autoPlay true whether play the carousel automatically or not.
intervalTime 1000 Interval time of auto-play, only enable when autoPlay is enable.
playSpeed 300 play speed.
indicator true show indicator or not
currentIndex 1 the index of current active item, strat from 1.

Api

Api Name Description Arguments
refresh refresh the compoennt's status. All states will be recalculated. -
goToPage Go to the specified page. (pageIndex: Number, animate: Boolean)
prev go to pre page.
next go to next page.

Author

WangYi7099(Yves Wang)

License

MIT