title: Decreasing time interval between image transition in Bootstrap image slider
body: <p>Actually I am new to bootstrap and I was given with task of decreasing the time interval between image change in the UI.</p>
  
  <p>Then I figured out it is happening through bootstrap image slider. Then I searched for this but not able to find anything. I want to reduce time interval between image transitions.</p>
  
  <pre><code>&lt;div class="carousel slide auto" id="c-slide" &gt;
     &lt;ol class="carousel-indicators out"&gt;
        &lt;li data-target="#c-slide" data-slide-to="0" class="active"&gt;&lt;/li&gt;
        &lt;li data-target="#c-slide" data-slide-to="1" class=""&gt;&lt;/li&gt;
        &lt;li data-target="#c-slide" data-slide-to="2" class=""&gt;&lt;/li&gt;
        &lt;li data-target="#c-slide" data-slide-to="3" class=""&gt;&lt;/li&gt;
        &lt;li data-target="#c-slide" data-slide-to="4" class=""&gt;&lt;/li&gt;
     &lt;/ol&gt;
     &lt;div class="carousel-inner"&gt;
        &lt;div class="item"&gt;
           &lt;p class="text-center bg-inverse"&gt;
              &lt;img src="images/sfk_splash1.jpg" alt="" border="0"&gt;
           &lt;/p&gt;
        &lt;/div&gt;
        &lt;div class="item active"&gt;
           &lt;p class="text-center bg-inverse"&gt;
              &lt;img src="images/sfk_splash2.jpg" alt="" border="0"&gt;
           &lt;/p&gt;
        &lt;/div&gt;
        &lt;div class="item"&gt;
           &lt;p class="text-center bg-inverse"&gt;
              &lt;img src="images/sfk_splash3.jpg" alt="" border="0"&gt;
           &lt;/p&gt;
        &lt;/div&gt;
        &lt;div class="item"&gt;
           &lt;p class="text-center bg-inverse"&gt;
              &lt;img src="images/sfk_splash4.jpg" alt="" border="0"&gt;
           &lt;/p&gt;
        &lt;/div&gt;
        &lt;div class="item"&gt;
           &lt;p class="text-center bg-inverse"&gt;
              &lt;img src="images/sfk_splash5.jpg" alt="" border="0"&gt;
           &lt;/p&gt;
        &lt;/div&gt;
     &lt;/div&gt;
     &lt;a class="left carousel-control" href="#c-slide" data-slide="prev"&gt;
     &lt;i class="icon-chevron-left"&gt;&lt;/i&gt;
     &lt;/a&gt;
     &lt;a class="right carousel-control" href="#c-slide" data-slide="next"&gt;
     &lt;i class="icon-chevron-right"&gt;&lt;/i&gt;
     &lt;/a&gt;
  &lt;/div&gt;          
  </code></pre>