Flickity HTML Initialisation

[aaronstezycki]

Is there anyway to achieve a callback like this #269, but by initialising with html ?

[desandro]

Hmm, interesting request.

If you are using jQuery, you can listen to the initial cellSelect event. See demo http://codepen.io/desandro/pen/NGzNgP

// capture initial cellSelect
$('body').one( 'cellSelect', function( event ) {
  console.log( 'initial cell select on ', event.target )  
});

But this code is a race condition, and may happen after the initial event has been triggered.

A better solution is to initialize in HTML with your own code so you don't have to hack it. See demo http://codepen.io/desandro/pen/yYEOza

// init Flickity on all .js-custom-flickity elements
$('.js-custom-flickity').each( function( i, elem ) {
  var $elem = $(elem);
  var optionsAttr = $elem.attr('data-flickity-options');
  var options = optionsAttr ? JSON.parse( optionsAttr ) : {};
  // init Flickity
  $elem.flickity( options );
});

[aaronstezycki]

Using a json parse. Brilliant, I had thought of that but wasn't quite sure how to execute it. This worked perfectly! :)

[Julix91]

Seems all the older ones point at non https versions of the link - wonder if that's fixable with a redirect or something?

[desandro]

@Julix91 pen files updated.