Why is the slick slider not working in the popup?

Question

JavaScript

There is one arcticmodal modal window that dynamically populates content. The content is different, but the same type (wrapper = slickslider + text block).

The window is displayed with inline content, but the slider is displayed incorrectly and the slider function itself does not work, and the text block looks normal.

Can anyone suggest why this is happening, in what direction to think?

Answer 1

In general, it can come in handy for someone: the slider worked for me when I initialized it in the afterShow parameter of the arcticmodal modal window,
but there was a problem, once the window opened and the slider worked, after closing the modal window everything stopped working. Even the modal window didn't open.
This problem was resolved by using the afterClose parameter, where a function was called in which the unslick method was applied to the block with the slider - and everything began to work with a bang!

$('.viewTxt').click(function(){
        var link = '#' + $(this).attr("data-link");

        $('#projectContent').html($(link).html());

        $('#projectWindow').arcticmodal({
            afterOpen: doIt(),  // doIt() - это вызов функции, в которой инициализируется slickslider
            afterClose: function () {
                $('.slider-for, .slider-nav').slick('unslick');
            }
    });

Answer 2

after ajax loading, initialize the slider again)