Flickity sync and nav hover event

[Moorst]

Hi,

I'm looking to change the main carousel on the hover event of a nav item, using flickity-sync.

metafizzy/flickity-sync#8 (comment) essentially covers the functionality I'm after, though of course I'd need a hover event instead of staticClick. Is this available, or is it possible to add a custom hover event?

e.g.

$navCarousel.on( 'hover.flickity', function( event, pointer, cellElement, cellIndex ) {
  if ( cellElement ) {
    $mainCarousel.flickity( 'select', cellIndex );
  }
});

[desandro]

Flickity does not have a hover event, but you could build this functionality with jQuery's mouseover event.

See demo https://codepen.io/desandro/pen/LJYxmZ

var $carouselMain = $('.carousel-main').flickity();

var $carouselNav = $('.carousel-nav').flickity({
  asNavFor: '.carousel-main',
  contain: true,
  pageDots: false,
});

// select main on nav hover
$carouselNav.on( 'mouseover', '.carousel-cell', function( event ) {
  var index = $( event.currentTarget ).index();
  $carouselMain.flickity( 'select', index );
});