2015-08-12 7 views
4

При загрузке слайдера в сложенном содержимом (плагин с угловым бутстрапом в этом случае) .slick-track div получает ширину 0px, в результате чего слайдер пытается подобрать все слайды на наверху eachother. При нажатии стрелки, чтобы увидеть следующий слайд, слайды вернутся к норме. Если я выберу ползунок и хочу проверить компоненты в моем браузере, он также вернется к норме.Катушка скольжения имеет ширину 0px при загрузке в сложенную вкладку

Пожалуйста, смотрите этот пример: http://plnkr.co/edit/iw9f2alEnK0HFkv1eq16?p=preview

Это пятно конфигурации я использую:

$(document).ready(function(){ 
    $('.tourImageSlider').slick({ 
      dots: true, 
      infinite: false, 
      slidesToShow: 3, 
      slidesToScroll: 1, 
      responsive: [ 
      { 
       breakpoint: 1500, 
       settings: { 
       slidesToShow: 2, 
       slidesToScroll: 1, 
       } 
      }, 
      { 
       breakpoint: 1000, 
       settings: { 
       slidesToShow: 1, 
       slidesToScroll: 1, 
       } 
      }] 
    }); 
}); 

ли кто-нибудь иметь представление о том, как решить эту проблему? Спасибо!

ответ

8

Наконец-то я получил ответ от пятнистого создателя Кена Уилера. Когда разборное содержание вызывается открытым, просто вызовите следующую строку:

$('.slider-class').slick('setPosition'); 

... и заменить «слайдер-класс» с именем класса вашего слайдера. Лично я создал эту функцию с угловой функцией и вызвал ее с помощью ng-open.

+0

Это plunkr с рабочим исправлением: http://plnkr.co/edit/LktMzu?p=preview –

+0

Как вы это сделаете, если у вас есть другие настройки в вашей функции slick? – MG1

 Смежные вопросы

  • Нет связанных вопросов^_^