javascript - Twitter Bootstrap 的旋转木马淡入淡出过渡

Question

这是关于@StrangeElement 对这个旧问题的回答的后续问题:Can the Twitter Bootstrap Carousel plugin fade in and out on slide transition

我尝试了@StrangeElement 的 bootstrap.css mod，我几乎让它工作了。问题是，当事件图像淡出时，它会淡化为白色，然后下一张图像会弹出，而不会出现动画淡入淡出。我可能在这里遗漏了什么？

这是我正在使用的示例:

http://planetofsoundonline.com/beta/index.php

任何类型的指针将不胜感激。谢谢!

Answer 1

拍一个look at this fiddle .遗憾的是，它不适用于任何当前可用版本的 Internet Explorer。

您的旋转木马 div 只需要添加一个额外的类 carousel-fade 即可工作。

[ source ]

此过渡显示下一张图像，然后在其顶部淡出新图像。如果您想要直接淡出淡入动画，请将这些行添加到 css。

.carousel.carousel-fade .item {
  opacity:0;
}

.carousel.carousel-fade .active.item {
    opacity:1;
}