Flickity Mimic

---

Demo ☞ hydnhntr.github.io/flickity-mimic/

+ Real-time dragging and navigation actions replicated
+ indexOffset option to set the mimic ahead or behind the target’s selectedIndex
+ No 2 way binding/sync compatibility, see Flickity Sync instead
+ Intended to work with dragging and accessibility options set to false.
+ No support for groupCells option, requires matching cell counts and works best with wrapAround: true

$3

+ Support different cell widths and cellAlign option.

Usage

`` html


` js
// mimic options object to be supplied as nameValuePair on Flickity config
mimic: {
target: '.gallery-a'
// set as a selector string or HTMLElement document.querySelector('.gallery-a'), jQuery('.gallery-a')[0]

indexOffset: 1
// Integer, defaults to 0
}
`

$3

` js
$('.gallery-a').flickity();
$('.gallery-b').flickity({
wrapAround: true,
draggable: false,
accessibility: false,
mimic: {
target: '.gallery-a',
indexOffset: 1
}
});
`

$3

` js
var flktyA = new Flickity('.gallery-a');
var flktyB = new Flickity( '.gallery-b', {
wrapAround: true,
draggable: false,
accessibility: false,
mimic: {
target: '.gallery-a',
indexOffset: 1
}
});
`

$3

` html


npm: npm install flickity-mimic`

$3

Untested, but should work as per Flickity’s existing plugins: asNavFor, sync. If not, I’ve goofed.

---

MIT license

By Hayden Hunter, built upon the hard yards by Metafizzy