Class Names

View plugin on GitHub

Class Names is a class name toggle utility plugin for Embla Carousel that enables you to automate the toggling of class names on your carousel.

Example

First you need to install the npm package and save it to your dependencies:

<script src="https://unpkg.com/embla-carousel-class-names/embla-carousel-class-names.umd.js"></script>

npm install embla-carousel-class-names --save

yarn add embla-carousel-class-names

Please read the plugins page to learn how to work with plugins.

Below follows an exhaustive list of all Class Names options and their default values.

Type: string
Default: is-snapped

Choose a classname that will be applied to the snapped slides. Pass an empty string to opt-out.

Type: string
Default: is-in-view

Choose a classname that will be applied to slides in view. Pass an empty string to opt-out.

This feature will honor the inViewThreshold option.

Type: string
Default: is-draggable

Choose a classname that will be applied to a draggable carousel container. Pass an empty string to opt-out.

Type: string
Default: is-dragging

Choose a classname that will be applied to the container when dragging. Pass an empty string to opt-out.