title: Autoplay in iDangerous swiper
body: <p>I am using iDangerous swiper in my application</p>
  
  <p>I have three images in my home page.</p>
  
  <p>I want to autoplay the images for every 3 seconds.</p>
  
  <pre><code>   &lt;div class="wrapper"&gt;
      &lt;div class="swiper-container" style="background: #CCCCCC"&gt;
          &lt;div class="swiper-wrapper"&gt;
  
              &lt;div class="swiper-slide tips_content2"&gt;
                  &lt;ul&gt;
                      &lt;li&gt;&lt;img src="1.jpg"&gt;&lt;/img&gt;&lt;span class="image1"&gt;Image 1&lt;/span&gt;&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
              &lt;div class="swiper-slide tips_content1"&gt;
                  &lt;ul&gt;
                     &lt;li&gt;&lt;img src="2.jpg"&gt;&lt;/img&gt;&lt;span class="image2"&gt;Image 2&lt;/span&gt;&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
              &lt;div class="swiper-slide tips_content"&gt;
                  &lt;ul&gt;
                  &lt;li&gt;&lt;img src="3.jpg"&gt;&lt;/img&gt;&lt;span class="image3"&gt;Image3&lt;/span&gt;&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
              &lt;/div&gt;
          &lt;div class="pagination"&gt;&lt;/div&gt;
      &lt;/div&gt;
  
  &lt;/div&gt;
  &lt;script&gt;
  var mySwiper = new Swiper('.swiper-container', { 
      mode: 'horizontal',
      pagination: '.pagination',
     loop:true,
      paginationClickable: true,
      autoplay:3000,
      freeMode:true,
      paginationElement:'div',
      onSlideNext :function(swiper){
      $('.swiper-active-switch').css('background-color', '#fff');
  }
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>The images are getting changed for every 3 seconds.But in the pagination div,there are five dots getting displayed instead of three dots.</p>
  
  <p>Also,the active swiper in the pagination is not getting switched appropriately.</p>
  
  <p>Please Advice.</p>
  
  <p>Thanks in Advance</p>