2016-09-06 2 views
0

Я пытаюсь включить слайдер на нескольких вкладках jquery, но поскольку слайдер нуждается в ширине и высоте для правильного отображения, мне нужно вызвать триггер изменения размера окна при изменении вкладок. Этот код работает, но только один раз:jQuery Window Resize Trigger Only Firing Once

jQuery(".vc_tta .vc_tta-tab, .vc_tta .vc_tta-panel-title").click(function() { 
    jQuery(window).trigger("resize"); 
}); 

Я разместил это вне моего документа. (Готов), но он по-прежнему работает только один раз.

Это мой полный сценарий:

jQuery(document).ready(function($){ 
    $('.slider-<?= $name ?>').slick({ 
     slidesToShow: 1, 
     centerMode: true, 
     centerPadding: '200px', 
     arrows: true, 
     focusOnSelect: true, 
     responsive: [ 
      { 
       breakpoint: 800, 
       settings: { 
        centerMode: false 
       } 
      } 
     ] 
    }); 
}); 

jQuery(".vc_tta .vc_tta-tab, .vc_tta .vc_tta-panel-title").click(function() { 
    jQuery(window).trigger("resize"); 
}); 

Я не могу повторить точно так, как я с помощью Visual Composer в WordPress, но это тот же вопрос: https://jsfiddle.net/keithpetrillo/d9jrgs80/

+0

ошибки консоли? –

+0

Нет, нет ничего, отображающего int he console –

+0

Работает только один раз или работает только для видимого элемента, потому что остальные скрыты с вкладками? – isherwood

ответ

1

Нет необходимости переместить функцию наружный document.ready. Попробуйте делегировать события из документа:

jQuery(document).on('click', ".vc_tta .vc_tta-tab, .vc_tta .vc_tta-panel-title", function() { 
    jQuery(window).trigger("resize"); 
}); 

Это работает с элементами, которые не существуют или скрыты при загрузке страницы.

+0

Это работает, но все равно только один раз :((первые вкладки, на которые я нажимаю, не имеет значения, какой) –

+0

Трудно сказать, что вы нам дали. Можете ли вы воспроизвести demo? – isherwood

+0

Да, я обновил свой вопрос выше –