How to make fade effect for bootstrap carousel?

Question

css

I updated the bootstrap to 3.3 and now the fade effect code does not work
What bootstrap used to be I can’t say ....
Who knows how to do it or correct this one ..?

.carousel-fade .item {
      opacity: 0;
      -webkit-transition-property: opacity;
      -moz-transition-property: opacity;
      -o-transition-property: opacity;
      transition-property: opacity;
    }

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

    .carousel-fade .active.left,
    .carousel-fade .active.right {
      left: 0;
      opacity: 0;
      z-index: 1;
    }

    .carousel-fade .next.left,
    .carousel-fade .prev.right {
      opacity: 1;
    }

  .carousel-fade .carousel-control {
    z-index: 2;
  }

It does not slide, but everything changes very quickly, there is no smoothness in the effect.

Answer 1

codepen.io/transportedman/pen/NPWRGq

Answer 2

doesn't anyone know?