animation - ngb-carousel 如何在图像/幻灯片之间使用淡入/淡出等动画？

Question

在 Ng bootstrap carousel 组件中，如何在图像/幻灯片之间进行淡入/淡出等过渡？

Answer 1

我找到了一种方法来包含像动画一样的淡入/淡出。
您必须定义 .carousel-item 和 .carousel-item.active css 类，如下所示:

.carousel-item {
    display: block !important;
    z-index: 1;
    position: absolute;
    opacity: 0;
    transition: opacity 1.5s ease-in-out, visibility 1s;
    visibility: hidden;
}
.carousel-item.active {
    position: relative;
    opacity: 1;        
    transition: opacity 1.5s ease-in-out, visibility 1s;
    visibility: visible;
    
}