title: Swiper Slider not working inside Bootstrap Tab Panel
body: <p>I'm using bootstrap tab &amp; <a href="http://www.idangero.us/swiper/" rel="noreferrer">swiper slider</a>,I have multiples tab, in all tabs have image slider. The swiper slider is working fine except pagination in first tab but another tab, both are not working. </p>
  
  <p>Basically i am doing phone-gap project. In this project requirement is that image slider into tab pane.</p>
  
  <p>Here is my code.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="container"&gt;
          &lt;!-- Nav tabs --&gt;
          &lt;ul class="nav nav-tabs" role="tablist"&gt;
              &lt;li class="active"&gt;
                  &lt;a href="#Apparel" role="tab" data-toggle="tab"&gt;
                      &lt;i class="fa fa-home"&gt;&lt;/i&gt; Apparel
                  &lt;/a&gt;
              &lt;/li&gt;
              &lt;li&gt;
                  &lt;a href="#Electronic" role="tab" data-toggle="tab"&gt;
                      &lt;i class="fa fa-user"&gt;&lt;/i&gt; Electronic
                  &lt;/a&gt;
              &lt;/li&gt;
              &lt;li&gt;
                  &lt;a href="#Furniture" role="tab" data-toggle="tab"&gt;
                      &lt;i class="fa fa-envelope"&gt;&lt;/i&gt; Furniture
                  &lt;/a&gt;
              &lt;/li&gt;
              &lt;li&gt;
                  &lt;a href="#Mobile" role="tab" data-toggle="tab"&gt;
                      &lt;i class="fa fa-cog"&gt;&lt;/i&gt; Mobile
                  &lt;/a&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
      &lt;!-- Tab panes --&gt;
      &lt;div class="tab-content"&gt;
          &lt;div class="tab-pane fade active in" id="Apparel"&gt;
              &lt;div class="swiper-container"&gt;
                  &lt;div class="swiper-wrapper"&gt;
                      &lt;div class="swiper-slide"&gt;Apparel Image 1&lt;/div&gt;
                      &lt;div class="swiper-slide"&gt;Apparel Image 2&lt;/div&gt;
                      &lt;div class="swiper-slide"&gt;Apparel Image 3&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;!-- Add Pagination --&gt;
                  &lt;div class="swiper-pagination"&gt;&lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="tab-pane fade" id="Electronic"&gt;
              &lt;div class="swiper-container"&gt;
                  &lt;div class="swiper-wrapper"&gt;
                      &lt;div class="swiper-slide"&gt;Electronic Image 1&lt;/div&gt;
                      &lt;div class="swiper-slide"&gt;Electronic Image 2&lt;/div&gt;
                      &lt;div class="swiper-slide"&gt;Electronic Image 3&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;!-- Add Pagination --&gt;
                  &lt;div class="swiper-pagination"&gt;&lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="tab-pane fade" id="Furniture"&gt;
              &lt;div class="swiper-container"&gt;
                  &lt;div class="swiper-wrapper"&gt;
                      &lt;div class="swiper-slide"&gt;Furniture Image 1&lt;/div&gt;
                      &lt;div class="swiper-slide"&gt;Furniture Image 2&lt;/div&gt;
                      &lt;div class="swiper-slide"&gt;Furniture Image 3&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;!-- Add Pagination --&gt;
                  &lt;div class="swiper-pagination"&gt;&lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="tab-pane fade" id="Mobile"&gt;
              &lt;div class="swiper-container"&gt;
                  &lt;div class="swiper-wrapper"&gt;
                      &lt;div class="swiper-slide"&gt;Mobile Phone Image 1&lt;/div&gt;
                      &lt;div class="swiper-slide"&gt;Mobile Phone Image 2&lt;/div&gt;
                      &lt;div class="swiper-slide"&gt;Mobile Phone Image 3&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;!-- Add Pagination --&gt;
                  &lt;div class="swiper-pagination"&gt;&lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p><strong>Javascript</strong></p>
  
  <pre><code>var swiper = new Swiper('.swiper-container', {
      pagination: '.swiper-pagination',
      paginationClickable: true,
      spaceBetween: 30,
      autoplay: 2500,
  });
  </code></pre>
  
  <p>Here is my Example <a href="http://jsfiddle.net/ANJYR/r30j0mje/6/" rel="noreferrer"><strong>FIDDLE</strong></a></p>
  
  <p>Please help me....</p>