web-dev-qa-db-fra.com

Les effets de carrousel des hiboux ne fonctionnent pas

    <script>
    $(document).ready(function () {
          $("#owl-demo").owlCarousel({
              navigation: true,
              navigationText: ["", ""],
              slideSpeed: 300,
              paginationSpeed: 400,
              autoPlay: true,
              mouseDrag: true,
              singleItem: true,
              animateIn: 'fadeIn',
              animateOut: 'fadeOut'
          });
      });
    </script>

Ci-dessus, citation de mon carrousel du hibou, je veux avoir un effet de fondu, mais il ne semble pas apparaître. Au lieu de cela, il apparaît comme effet glissant.

jqueryeffectowl-carousel
5
itnotsopro

Je ne pense pas qu'il y ait une option pour la transition en fondu: 

transitionStyle: "fade" // not available in the docs

une autre option consiste à utiliser animate.css en conjonction avec celui-ci: 

$("#owl-demo").owlCarousel({
  navigation: true,
  navigationText: ["", ""],
  slideSpeed: 300,
  paginationSpeed: 400,
  autoPlay: true,
  mouseDrag: true,
  singleItem: true,
  animateIn: 'fadeIn', // add this
  animateOut: 'fadeOut' // and this
});
10
Jai

La version que vous utilisez ... Votre exemple de code mélange les options des versions 1.3. * Et 2. *.

Depuis la version 2. * vous avez besoin de:

animateIn: 'fadeIn',
animateOut: 'fadeOut',

https://owlcarousel2.github.io/OwlCarousel2/docs/api-options.html

Dans la version 1.3. * Vous avez besoin de:

transitionStyle: "fade"

http://www.landmarkmlp.com/js-plugin/owl.carousel/#customizing

4
Benjamin

animateIn: 'fadeIn', animateOut: 'fadeOut',

Will travaillera version - Owl Carousel v2.2.1

0
Mr. Sen