ember-flickity

An ember addon for flickity.

Usage no npm install needed!

<script type="module">
  import emberFlickity from 'https://cdn.skypack.dev/ember-flickity';
</script>

README

Ember-flickity

Build Status

An Ember addon for flickity

Installation

ember install ember-flickity

Usage

{{#em-flickity class="my-slideshow" showSlides=(gt items.length 1)}}
  {{#each items as |item|}}
    <div class="my-slideshow__item"></div>
  {{/each}}
{{/em-flickity}}

showSlides is a Boolean. This allows you to enable or disable flickity based on the number of items you have in the list.

Flickity options and events

All options and events are supported.

    actions:{
      mySettle(index, flickityElement) => {
        console.log('settle');
      },
    }
{{#em-flickity pageDots=true draggable=true showSlides=(gt numItems 1) settle=(action 'mySettle')}}

{{/em-flickity}}
  events: computed(() => {
    return {
      ready: (index, flickityElement) => {
        console.log('ready');
        flickityElement.resize();
      },
      change: (index, flickityElement) => {
        console.log('change');
      },
    };
  }),
{{#em-flickity pageDots=true draggable=true events=events}}

{{/em-flickity}}