sp-carousel-3d v1.0.1

sp carousel 3d (基于https://github.com/wlada/vue-carousel-3d修改)

comment: <> ([(https://img.shields.io/badge/Donate-PayPal-green.svg)](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=R64SW4VNC6MGL&source=url))

comment: <> ([(https://img.shields.io/npm/dm/vue-carousel-3d.svg)](https://npmjs.com/package/vue-carousel-3d))

comment: <> ([(https://travis-ci.org/Wlada/vue-carousel-3d.svg?branch=master)](https://travis-ci.org/Wlada/vue-carousel-3d))

comment: <> ([(https://coveralls.io/repos/github/Wlada/vue-carousel-3d/badge.svg)](https://coveralls.io/github/Wlada/vue-carousel-3d))

comment: <> ([(https://api.codacy.com/project/badge/Grade/22c6361755bb4bdd935fd8534babbbb8)](https://app.codacy.com/app/Wlada/vue-carousel-3d?utm_source=github.com&utm_medium=referral&utm_content=Wlada/vue-carousel-3d&utm_campaign=Badge_Grade_Dashboard))

comment: <> ([(https://img.shields.io/npm/v/vue-carousel-3d.svg)](https://www.npmjs.com/package/vue-carousel-3d))

comment: <> (The repository is back in action. I'll try to keep it updated and to merge pull requests occasionally. Also, some new features are coming soon.)

comment: <> (Feel free to submit issues and feature requests here(https://github.com/wlada/vue-carousel-3d/issues);.)

comment: <> (Full documentation and examples(https://wlada.github.io/vue-carousel-3d);)

comment: <> (## Table of Contents)

comment: <> (- Installation(#installation))

comment: <> (- Usage(#usage))

comment: <> (- Development(#development))

comment: <> (- License(#license))

Installation

npm install -S sp-carousel-3d

Usage

npm install --registry=https://registry.npm.taobao.org

Usage (Global)

import Vue from 'vue';
import Carousel3d from 'sp-carousel-3d';

Vue.use(Carousel3d);

This will make <carousel-3d> and <slide> available to all components within your Vue app.

Usage (Local)

Include the Carousel 3d into your component using import:

import { Carousel3d, Slide } from 'sp-carousel-3d';

export default {
  ...
  components: {
    Carousel3d,
    Slide
  }
  ...
};

HTML Structure

Once the Carousel3d and Slide components are installed globally or imported, they can be used in templates like below:

  <carousel-3d>
    <slide :index="0">
      Slide 1 Content
    </slide>
    <slide :index="1">
      Slide 2 Content
    </slide>
  </carousel-3d>

Keep in mind that index property on slide component is required property and you will need to pass it for every slide starting from 0

License

This project is licensed under the MIT License - see the LICENSE.md file for details.

Changelog

####Version 1.0.0

• All dependencies updated to the latest
• Added one directional carousel and updated the docs (docs updated)
• area-labels added to the buttons
• Y-axys swipe bug fixed.
• Fix SSR
• onMainSlideClick callback now returns the slide index as function parameter (docs updated)
• Added scoped slides (docs updated)

####Version 1.0.1

• Added a switch to drag or click the target