Running slick under fancybox glitches out

[baptisterajaut]

Initilaizing slick in fancybox makes slick completley freak out, even initialized after the pop up. Fiddle included

====================================================================

https://jsfiddle.net/ess6g6yq/4/

====================================================================

Steps to reproduce the problem

1. Create a fancybox iwth an slick inside
2. Play around
3. it will go crazy and worse

====================================================================

What is the expected behaviour?

Just a slick inside a fancybox

====================================================================

What is observed behaviour?

The fancybox first goes a lot below than expected Then the slick zooms out and zooms out

====================================================================

More Details

-Running on Chromium engine (Opera 45) -jquery 3.1.1 -slick 1.6.0

Btw fancybox works well alone, so does slick...

Cheers

[amichel86]

Were you able to init Slick Slider after Fancybox loaded?

[baptisterajaut]

This has been two and a half year ago, and I switched job 2 times in the meantime. I don't remember how I worked around it. But yeah I could initialize both, it just went crazy.

[amichel86]

Here's what I did in order for it to work. It doesn't work in an Ajax modal but hidden HTML, yes. I only added the "atferLoad" portion. Maybe it's gonna help someone in the future! :D

// Fancybox
$('[data-fancybox]').fancybox({
    hideScrollbar: false,
    autoFocus: false,
    smallBtn : false,
    buttons : ['close'],
afterLoad: function(){
  $('.slider-testimonials').slick('setPosition');
}           
});