AlipesCarousel 1.3.14

AlipesCarousel was created to provide custom carousel solutions designed by Alipes. It currently contains 3 different types of custom carousels.

How to use

• npm install alipes-carousel
• require('alipes-carousel/js/alipesCarousel') for the javascript
• import '~alipes-carousel/scss/alipesCarousel.scss' for the scss

There are currently settings you can override:

###Default:

$('#my-carousel').alipesCarousel({
    type: 'sonyacel',
    navPrev: true,
    navPrevClass: 'prev',
    navPrevContent: '<',
    navNext: true,
    navNextClass: 'next',
    navNextContent: '>',
    indicators: true,
    transtionTextColor: true,
    carouselHeightBasedOnImage: false,
    defaultCarouselHeight: 500
});

Settings

Option | Description ------ | ----------- type | Avaliable: 'sonyacel', 'singleSlide', and 'sudensel' navPrev | bool value. Show previous arrow navigation navPrevClass | Add custom class to the previous arrow navigation navPrevContent | Change the arrows to your own custom version navNext | bool value. Show next arrow navigation navNextClass | Add custom class to the next arrow navigation navNextContent | Change the arrows to your own custom version indicators | true/false value. Add dot indicators transtionTextColor | true/false value. Transition the background color for the text slider carouselHeightBasedOnImage | bool value. Allows the carousel to size based on the images used. Only used in sonyacel defaultCarouselHeight | int value. Only used when carouselHeightBasedOnImage is TRUE. Only used in sonyacel

Methods

$('#my-carousel').alipesCarousel().destroy();

Removes all the event listeners in the carousel

SingleSlider

In order to use this feature, you must install hammerjs for mobile support (touch guestures) Uses 2.0.8 as of 10/17/2017

Standalone Installation

1. npm install
2. npm run build or webpack
3. php -S localhost:8000
4. navigate to localhost:8000 in browser
5. profit