title: Add dynamic text animation to nivo slider
body: <p>Looking for the best approach to add dynamic text animations to a nivo slider. Trying to use <code>animate.css</code>for the animations but the text is not animating. I tried adding an animation to some text outside the slider and it works fine. So not sure why it doesn't work in the slider.
  Will include the nivo demo.html file I tried to modify. Any help would be appreciated. </p>
  
  <pre><code>&lt;head&gt;
  &lt;title&gt;Nivo Slider Demo&lt;/title&gt;
  &lt;link rel="stylesheet" href="../themes/default/default.css" type="text/css" media="screen" /&gt;
  &lt;link rel="stylesheet" href="../themes/light/light.css" type="text/css" media="screen" /&gt;
  &lt;link rel="stylesheet" href="../themes/dark/dark.css" type="text/css" media="screen" /&gt;
  &lt;link rel="stylesheet" href="../themes/bar/bar.css" type="text/css" media="screen" /&gt;
  &lt;link rel="stylesheet" href="../nivo-slider.css" type="text/css" media="screen" /&gt;
  &lt;link rel="stylesheet" href="style.css" type="text/css" media="screen" /&gt;
  &lt;link rel="stylesheet" href="../animate.css" type="text/css" media="screen" /&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>&lt;body&gt;
  &lt;div id="wrapper"&gt;
      &lt;a href="http://dev7studios.com" id="dev7link" title="Go to dev7studios"&gt;dev7studios&lt;/a&gt;
  
      &lt;div class="slider-wrapper theme-default"&gt;
          &lt;div id="slider" class="nivoSlider"&gt;
              &lt;img src="images/toystory.jpg" data-thumb="images/toystory.jpg" alt="" title="#htmlcaption1" /&gt;
              &lt;a href="http://dev7studios.com"&gt;&lt;img src="images/up.jpg" data-thumb="images/up.jpg" alt="" title="This is an example of a caption" /&gt;&lt;/a&gt;
              &lt;img src="images/walle.jpg" data-thumb="images/walle.jpg" alt="" data-transition="slideInLeft" /&gt;
              &lt;img src="images/nemo.jpg" data-thumb="images/nemo.jpg" alt="" title="#htmlcaption" /&gt;
          &lt;/div&gt;
          &lt;div id="htmlcaption1" class="nivo-html-caption animated bounceIn"&gt;
              &lt;strong&gt;This&lt;/strong&gt; is an example of a &lt;em&gt;HTML&lt;/em&gt; caption with &lt;a href="#"&gt;a link&lt;/a&gt;. 
          &lt;/div&gt;
          &lt;div id="htmlcaption" class="nivo-html-caption animated bounceIn"&gt;
              &lt;strong&gt;This&lt;/strong&gt; is an example of a &lt;em&gt;HTML&lt;/em&gt; caption with &lt;a href="#"&gt;a link&lt;/a&gt;. 
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="animated bounceIn" style="position: absolute; top: 300px; left: 30px;"&gt;
          &lt;h1 style="font: 20px;"&gt;this is a test&lt;/h1&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;script type="text/javascript" src="scripts/jquery-1.9.0.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="../jquery.nivo.slider.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(window).load(function() {
      $('#slider').nivoSlider({
          effect: 'fade'
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>
  </p>