FlexSlider图像不会加载到选项卡上

Question

我在一个页面中有2个滑块，没有标签，它们正常工作。 查看下面的屏幕截图

但是当我尝试应用标签窗格时，我的第二个滑块未显示

看起来像这样

但是当我最小化然后最大化它将显示的页面。

这是我的代码

HTML

<div class="tabs">
  <ul class="nav nav-tabs">
    <li class="active"> <a data-toggle="tab" href="#slider">{lang_media_slider}</a> </li>
    <li> <a data-toggle="tab" href="#fplans">{lang_media_plans} </a> </li> 
    <li> <a data-toggle="tab" href="#video">{lang_media_video} </a> </li>
    <li> <a data-toggle="tab" href="#360">{lang_media_360} </a> </li>

  </ul><!--nav tabs end-->
<!-- Tab Content-->
<div class="tab-content">

<div id="fplans" class="tab-pane">
<!-- FLOOR PLANS-->
<div class="property-slider2">

 <div id="secondary-property-images" class="flexslider">
                  <ul class="slides">
                    <li class="item"> <img src="http://placehold.it/600x400&amp;text=IMAGE+PLACEHOLDER" alt=""> </li>
                    <li class="item"> <img src="http://placehold.it/600x400&amp;text=IMAGE+PLACEHOLDER" alt=""> </li>
                    <li class="item"> <img src="http://placehold.it/600x400&amp;text=IMAGE+PLACEHOLDER" alt=""> </li>
                    <li class="item"> <img src="http://placehold.it/600x400&amp;text=IMAGE+PLACEHOLDER" alt=""> </li>
                  </ul>
              </div>

                <div id="secondary-property-thumbs" class="flexslider">
                  <ul class="slides">
                    <li class="item"> <img src="http://placehold.it/600x400&amp;text=IMAGE+PLACEHOLDER" alt=""> </li>
                    <li class="item"> <img src="http://placehold.it/600x400&amp;text=IMAGE+PLACEHOLDER" alt=""> </li>
                    <li class="item"> <img src="http://placehold.it/600x400&amp;text=IMAGE+PLACEHOLDER" alt=""> </li>
                    <li class="item"> <img src="http://placehold.it/600x400&amp;text=IMAGE+PLACEHOLDER" alt=""> </li>
                  </ul>
                </div>
</div>
  </div><!-- Floor plan id end-->

JS

/* Property details slider */
    $('#property-thumbs').flexslider({
    animation: "slide",
    controlNav: false,
    animationLoop: false,
    slideshow: false,
    itemWidth: 175,
    itemMargin: 10,
    asNavFor: '#property-images',            
    prevText: "",          
    nextText: ""
  });

  $('#property-images').flexslider({
    animation: "slide",
    controlNav: false,
    animationLoop: false,
    slideshow: true,
    sync: "#property-thumbs",            
    prevText: "",          
    nextText: ""
  });


    /* Property details slider */
  $('#secondary-property-thumbs').flexslider({
    animation: "slide",
    controlNav: false,
    animationLoop: false,
    slideshow: false,
    itemWidth: 175,
    itemMargin: 10,
    asNavFor: '#secondary-property-images',            
    prevText: "",          
    nextText: ""
  });

  $('#secondary-property-images').flexslider({
    animation: "slide",
    controlNav: false,
    animationLoop: false,
    slideshow: true,
    sync: "#secondary-property-thumbs",            
    prevText: "",          
    nextText: ""
  });

我需要一个java脚本来允许我的滑块在另一个标签内？如果我需要任何人可以提供帮助/建议吗？

三江源！

注意：我尝试使用此脚本但仍无效

  /*ALLOW TABS*/
  $('a[href="#fplans"]').one('shown.bs.tab', function (e) {
    $('.slides').flexslider();
});