title: Owl Carousel 2 can't make fade animation work
body: <p>Here is an example of Owl Carousel 2 fade animation: <a href="http://www.owlcarousel.owlgraphic.com/demos/animate.html" rel="nofollow">http://www.owlcarousel.owlgraphic.com/demos/animate.html</a></p>
  
  <p>I think I have included all required css and js files and here is my code:</p>
  
  <pre><code>/* ==============================================
      OWL CAROUSEL
  =============================================== */
  var $slides_nav = ( $('#slides').attr('data-direction') == 1 ) ? true : false;
  var $slides_speed = $('#slides').attr('data-speed');
  
  $("#slides ul").owlCarousel({
      navText: ['&lt;i class="fa fa-angle-left"&gt;&lt;/i&gt;','&lt;i class="fa fa-angle-right"&gt;&lt;/i&gt;'],
      nav: $slides_nav,
      animateOut: 'fadeOut',
      items:1,
      margin:0,
      loop:true,
      autoplay:true,
      autoplayTimeout:8000,
      autoplayHoverPause:false,
      dots: false,
      stagePadding:0,
      smartSpeed:1000,
  
  });
  </code></pre>
  
  <p>The slider works but the slide transitions does not fade..</p>
  
  <p>You can see in my <a href="http://themescreators.com/battle/" rel="nofollow">website</a> </p>