Scrollable list – fade effect (instead of slide)

This feature only works with Pro version.

By default, the Scrollable list uses the slide effect when switching slides.
To use the fade effect, please:

  • add this code to Custom JS field in Content Views >> Settings page:
    $('.pt-cv-carousel').addClass('carousel-fade');
    
  • add this code to Custom CSS field in Content Views >> Settings page:
    .carousel-fade .carousel-inner .item{-webkit-transition-property:opacity!important;transition-property:opacity!important}.carousel-fade .carousel-inner .active.left,.carousel-fade .carousel-inner .active.right,.carousel-fade .carousel-inner .item{opacity:0}.carousel-fade .carousel-inner .active,.carousel-fade .carousel-inner .next.left,.carousel-fade .carousel-inner .prev.right{opacity:1}.carousel-fade .carousel-inner .active.left,.carousel-fade .carousel-inner .active.right,.carousel-fade .carousel-inner .next,.carousel-fade .carousel-inner .prev{left:0;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.carousel-fade .carousel-control{z-index:2}
    

Best regards,