title: How to differentiate between auto-slide and click slide Bootstrap carousel?
body: <p>I have carousel control buttons that I am adding an <code>active</code> class to when a new slide is selected.</p>
  
  <p>This is a simple task when someone clicks on one of these buttons, but if I want to incorporate <code>autoplay</code>, this suddenly becomes much more challenging.</p>
  
  <p><strong>Here is the problem:</strong></p>
  
  <p>I can bind <code>slid</code> to a function that adds the active class to my control buttons, and it will be functional, BUT there will be a delay between the start of the slide and the addition of the active class, because <code>slid</code> is fired when the slide is complete.</p>
  
  <p>Fortunately, Bootstrap provides <code>slide</code>, which is fired when a slide is initiated. I could bind <code>slide</code> to a function that adds the active class to the next slide in the list, but then this would cause problems when I try to click a control button for a slide that is out of order.</p>
  
  <p><code>slide</code> is fired whenever a slide happens, so if someone clicks on a control button that is not in the normal slide order, I will end up with two active buttons.</p>
  
  <p>The only solution I can see currently, is to somehow differentiate between a <code>slide</code> event that is automatically triggered, and one that is triggered by a click.</p>
  
  <p>Any ideas?</p>