Question

我在我自己的css文件＆＃39; style.css＆＃39;中尝试了以下代码。但它不起作用。幻灯片效果不会改变，如果我对所有这些css都很重要，那么之前的幻灯片转换也不起作用。

 .carousel-fade .carousel-inner .item {
      opacity: 0;
      -webkit-transition-property: opacity;
      -moz-transition-property: opacity;
      -o-transition-property: opacity;
      transition-property: opacity;
    }
    .carousel-fade .carousel-inner .active {
      opacity: 1;
    }
    .carousel-fade .carousel-inner .active.left,
    .carousel-fade .carousel-inner .active.right {
      left: 0;
      opacity: 0;
      z-index: 1;
    }
    .carousel-fade .carousel-inner .next.left,
    .carousel-fade .carousel-inner .prev.right {
      opacity: 1;
    }
    .carousel-fade .carousel-control {
      z-index: 2;
    }

Answer 1

对于显示为淡入而不是滑入视图的模式，请尝试将.fade类添加到模态标记中。

<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
 ........
</div>

Answer 2

您是否正确绑定了Javascript组件？

<script src="/Javascript/Bootstrap/transition.js"></script>
<script src="/Javascript/Bootstrap/carousel.js"></script>

通常情况下，您还必须给旋转木马滑动＆＃34;滑动＆＃34; class，覆盖效果。

如何将引导幻灯片的幻灯片效果更改为淡入淡出效果？

2 个答案: