Как сделать чтобы слайдер корректно отображался после появления?

Question

[grishaaa]

Я скрыл слайдер, по клике на кнопку у меня появляется слайдер но сразу корректно не отображается слайдов не видно, а только после того как начнешь его листать или уменьши экран. """ Как это исправить """
Используется слайдер slick
Вот какой код в данный момент подключен для слайдера
jQuery('.slider').slick({
dots: false,
infinite: true,
speed: 500,
autoplaySpeed: 1000,
autoplay: false,
arrows: true,
slidesToShow: 1,
slidesToScroll: 1,
});

Answer 1

[Никита Кит]

Пффф, так ты уж тогда и инициализируй слайдер при клике.
У тебя же стопудово он прогружается и инициализируется в display: none, поэтому javascript плагина не видит высоты и ширины слайдов.
Вот этот jQuery('.slider').slick({... у тебя должен быть в вызове функции.

Comments

[grishaaa]

Никита Кит
Вот мой весь код js который отвечает за показ дива в котором находится слайдер
https://jsfiddle.net/o7rrjqqh/
И куда здесь мне вписать этот код jQuery('.slider').slick({...

[Никита Кит]

grishaaa: да откуда я знаю. Сам в своём коде разбирайся. Подумай в какой момент должен инициализироваться слайдер и туда вставляй.
У меня подобная ситуация была со свайпером, я её так и решил.
ntpo-vektor.ru/assets/template/scripts/main.js
В dist там страшно - найди просто по ctrl+F title.click(function(){ и увидишь ивент при котором я инициализировал слайдеры на этой странице
ntpo-vektor.ru/sertifikates.html

Хотя у меня ивент немного другой внутри, я надеюсь ты умеешь писать на jQuery и сам разберёшься что куда вставлять. Ибо понту делать за тебя, если солюшен тебе не очевиден)))