javascript Owl Carousel 2 不能让淡入淡出动画工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29363786/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Owl Carousel 2 can't make fade animation work
提问by ThemesCreator
Here is an example of Owl Carousel 2 fade animation: http://www.owlcarousel.owlgraphic.com/demos/animate.html
这是 Owl Carousel 2 淡入淡出动画的示例：http: //www.owlcarousel.owlgraphic.com/demos/animate.html
I think I have included all required css and js files and here is my code:
我想我已经包含了所有必需的 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,
});
The slider works but the slide transitions does not fade..
滑块有效，但幻灯片过渡不会褪色..
You can see in my website
你可以在我的网站上看到
回答by ThemesCreator
I have found the problem. I had put this in my css, necessary for others animations in the page:
我找到了问题所在。我已经把它放在我的 css 中，这是页面中其他动画所必需的：
.animated {
visibility:hidden;
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
-ms-animation-delay: 0.3s;
}
This was causing the issue. I have added the code below and it works now.
这导致了这个问题。我已经添加了下面的代码，现在可以使用了。
.owl-item.animated {
visibility: visible;
}
