title: owl carousel scroll to clicked item
body: <p>I have a simple owl-carousel, </p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="owl-carousel"&gt;
      &lt;div class="item"&gt;&lt;h4&gt;1&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;2&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;3&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;4&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;5&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;6&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;7&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;8&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;9&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;10&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;11&lt;/h4&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;h4&gt;12&lt;/h4&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>$('.owl-carousel').owlCarousel({
      items: 5,
      loop:true,
      nav:true,
      margin: 10
  })
  </code></pre>
  
  <p>Included:</p>
  
  <ul>
  <li>owl.carousel.js</li>
  <li>owl.carousel.min.css</li>
  </ul>
  
  <p>JSFiddle <a href="http://jsfiddle.net/93cpX/62/" rel="noreferrer">http://jsfiddle.net/93cpX/62/</a></p>
  
  <p>How to force the carousel scroll to the clicked item?</p>