Flexslider не работает в закладках

Question

Я использую плагин Magic Post Slider wordpress для отображения flexslider на страницах продукта woocommerce. Я использую плагин tabs для отображения информации и слайдера внутри него, но flexslider не работает во вкладках, пока я не изменил вкладку браузера или не изменил размер окна браузера, тогда работает flexslider и покажет все изображения.

Я также применил исправление, но все еще не работает. Я добавляю мой JS код здесь

$(document).ready(function($) { 

    $('a[href="#tab-product_editor_313_tab"]').click(function() { 

     setTimeout(function() { 
      $(window).trigger('resize'); 
     }, 0); 

     setTimeout(function() { 
      $(window).trigger('resize'); 
     }, 2) 
    }); 

    var interval = 4000; 
    var autoslide = true; 

    interval = $(this).data("interval"); 

    if(interval == 0){ 
     autoslide = false; 
    } else { 
     autoslide = true; 
    } 

    $('.flexslider').flexslider({ 
     selector: ".slides > li", 
     animation: "slide", 
     prevText: "", 
     nextText: "", 
     pauseOnHover: true, 
     animationLoop: true, 
     animationSpeed: 300, 
     slideshowSpeed: interval, 
     directionNav : true, 
     slideshow: autoslide, 
     controlNav: false, 
     start: function(){ 
      $(window).resize(); 
     }, 
    }); 

    $(window).resize(); 

}); 

Answer 1

Я думаю, что ваш путь изображения неверен. проверьте элемент и проверьте путь изображения.

Answer 2

здесь правильный код

$(window).load(function() { 

$('a[href="#tab-product_editor_313_tab"]').click(function() { 

    setTimeout(function() { 
     $(window).trigger('resize'); 
    }, 0); 

    setTimeout(function() { 
     $(window).trigger('resize'); 
    }, 2) 
}); 

var interval = 4000; 
var autoslide = true; 

interval = $(this).data("interval"); 

if(interval == 0){ 
    autoslide = false; 
} else { 
    autoslide = true; 
} 

$('.flexslider').flexslider({ 
    selector: ".slides > li", 
    animation: "slide", 
    prevText: "", 
    nextText: "", 
    pauseOnHover: true, 
    animationLoop: true, 
    animationSpeed: 300, 
    slideshowSpeed: interval, 
    directionNav : true, 
    slideshow: autoslide, 
    controlNav: false, 
    start: function(){ 
     $(window).resize(); 
    }, 
}); 

    $(window).resize(); 

    });