title: Placing text over images
body: <p>I am using <a href="http://owlgraphic.com/owlcarousel/" rel="noreferrer">owl-carousel</a> to make a <code>slider</code> for a website. I could easily make a slider using the following code :</p>
  
  <pre><code>&lt;div id="owl-slider" class="owl-carousel"&gt; 
                  &lt;div&gt; &lt;img src="images/1.jpg" /&gt; &lt;/div&gt;
                  &lt;div&gt; &lt;img src="images/2.jpg" /&gt; &lt;/div&gt;
                  &lt;div&gt; &lt;img src="images/3.jpg" /&gt; &lt;/div&gt;
                  &lt;div&gt; &lt;img src="images/4.jpg" /&gt; &lt;/div&gt;
  &lt;/div&gt;
  
  
  &lt;script type="text/javascript"&gt;
                  $("#owl-slider").owlCarousel({
                      items : 1,
                      autoPlay : true,
                      slideSpeed : 200,
                      stopOnHover : true,
                      navigation : false
                  })
  
                  $(document).ready(function() {
                      $("#owl-slider").owlCarousel();
  
                  }); 
  &lt;/script&gt;
  </code></pre>
  
  <p>I also want to place some text on the images in the slider. Unique text for each image. How can I do this with owl-carousel ?</p>