search

metafizzy / flickity

:leaves: Touch, responsive, flickable carousels
https://flickity.metafizzy.co
7.53k stars 602 forks source link

Flickity - Flash of unstyled content #941

Closed bmpf closed 5 years ago

bmpf commented 5 years ago

The second example of this pen , after refreshing the page, wont work anymore. The diference between the example 01 and 02 is : data-flickity='{"wrapAround": true, "freeScroll": false, "pauseAutoPlayOnHover": false, "selectedAttraction": 0.01, "friction": 0.15, "autoPlay": true}'

Example: https://codepen.io/bmpf/pen/OYyzZy

Is there other options ? It gets really ugly when loading the page.

desandro commented 5 years ago

With the second carousel, Flickity is already initialized with data-flickity in HTML. So its initialized with hidden content. I think the better approach is to initialize Flickity after it has been un-hidden. See demo https://codepen.io/desandro/pen/0e4d1cddfcf4bd084d6bccfa5f96f819

bmpf commented 5 years ago

Thanks desandro. Seems very nice now :)