Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Отображение модального окна со slick slider (https://javascript.ru/forum/jquery/54568-otobrazhenie-modalnogo-okna-so-slick-slider.html)

Drm1804 23.03.2015 10:30

Отображение модального окна со slick slider
 
Вложений: 1
Доброго времени суток. Возникла такая проблема. Имеется ротатор товаров, который сделан с использованием slick slider. После нажатия на товар, появляется модальное окно с этим ротатором.

Проблема в том, что при первом появлении модального окна расположение элементов в слайдере не правильно, элементы выстраиваются вертикально, и соответственно все едет. Но при изменении размера окна браузера, или при переключении ротатора, все встает на место

Демо пример: http://test11.alekseev.pw/catalog_modal.html

(чтобы воспроизвести ошибку необходимо кликнуть на любой товар из каталога)

Так же прикладываю архив с файлами

рони 23.03.2015 13:07

Drm1804,
скрывать модальное окно надо только после того как прошла инициализация слайдера
$('.modal').show();
$('.main_modal_slider').slick({
dots: true,
infinite: true,
speed: 1000,
slide: '.main_modal_slide_item',
slidesToShow: 1,
slidesToScroll: 1,
touchMove: false,
adaptiveHeight: true
});
$('.modal').hide()

рони 23.03.2015 13:42

Drm1804,
вариант попроще
function modalWindow(){
    var modal = document.getElementsByClassName('modal'); //Находим модальное окно

    if (modal[0].style.display == 'block'){
        modal[0].style.display = 'none';

    }else{
        modal[0].style.display = 'block';
    *!*  $(window).resize() */!*
    }
}

Drm1804 23.03.2015 17:01

Спасибо огромное


Часовой пояс GMT +3, время: 21:19.