2015-03-31 63 views
1

这里是猫头鹰传送带2的动画渐变的例子:http://www.owlcarousel.owlgraphic.com/demos/animate.html猫头鹰旋转木马2不能使动画渐变工作

我想我已经包括了所有必需的CSS和JS文件,这里是我的代码:

/* ============================================== 
    OWL CAROUSEL 
=============================================== */ 
var $slides_nav = ($('#slides').attr('data-direction') == 1) ? true : false; 
var $slides_speed = $('#slides').attr('data-speed'); 

$("#slides ul").owlCarousel({ 
    navText: ['<i class="fa fa-angle-left"></i>','<i class="fa fa-angle-right"></i>'], 
    nav: $slides_nav, 
    animateOut: 'fadeOut', 
    items:1, 
    margin:0, 
    loop:true, 
    autoplay:true, 
    autoplayTimeout:8000, 
    autoplayHoverPause:false, 
    dots: false, 
    stagePadding:0, 
    smartSpeed:1000, 

}); 

滑块的作品,但在幻灯片切换不褪色..

你可以在我的website

回答

3

我已经发现了这个问题看。我已经把这个在我的CSS,页面中的其他动画必要:

.animated { 
    visibility:hidden; 
    -webkit-animation-delay: 0.3s; 
    -moz-animation-delay: 0.3s; 
    -o-animation-delay: 0.3s; 
    -ms-animation-delay: 0.3s; 
} 

这是造成这个问题。我已经添加了下面的代码,它现在可以工作。

.owl-item.animated { 
    visibility: visible; 
}