BxSlider Fade in et Fade Out

StackOverflow'ers

Je suis nouveau sur jQuery mais je suis actuellement en utilisant le BXslider Brancher.

<script type="text/javascript">
  $(document).ready(function(){
    $('#slider').bxSlider();
  });
</script>

Tout ce que je veux faire est de faire le curseur sur chaque diapositive, glisser dans et hors, de gauche à droite.

InformationsquelleAutor Owen O'Neill | 2012-07-02
  1. 6

    Dans le lien que vous avez posté sont vos options pour personnaliser le plugin. Vous pouvez modifier les valeurs comme ceci:

    $(document).ready(function(){
    $('#slider').bxSlider({
    mode: 'fade',
    });
});

    Si vous êtes à la recherche pour plus de transition/d'assouplissement options, vous aurez besoin d'inclure jQuery Easing. Ici: http://gsgd.co.uk/sandbox/jquery/easing/

    Puis ajouter l'assouplissement option de ce genre:

    easing: 'swing',

    FYI "swing" est la valeur par défaut.

    • Juste ce que je recherchais! Cependant, il n'est pas "balancer" dans. C'est juste transition d'une diapositive à la suivante, de sorte que la perte de son défaut de gauche à droite et de transition. Aucune chance qu'il vienne de la droite vers la gauche et se fanent? Mais je vous remercie beaucoup pour votre btw.
    • Si vous ne voulez pas qu'il fondu, retirez l'option de mode (car la valeur par défaut est "horizontale"). Pour changer la direction du curseur, ajouter cette option: autoDirection: 'prev',
    • Je veux le faire glisser à l'horizontale et à la décoloration. Pour l'instant c'est juste de la décoloration. Des idées?
    • Comme je l'ai dit, changer de mode à quelque chose de plus "fade". La chose est, je ne pense pas que vous pouvez vraiment avoir fondu et de diapositive... avez-vous un exemple de cette action?
    • Si je change de mode, il est généralement l'un ou l'autre, pourraient essayer vitessedébut, de voir comment ce flux. Merci Connor! Apprécié!
    InformationsquelleAutor Connor
  2. 0

    L'ID de la liste ou de la div doit être égale à quel est le code jQuery.

    Voir si il y a d'autres codes qui n'ont pas été correctement fermé et que peut-être interférer avec ce.

    Veillez à ce que la version de jQuery qui est compatible avec le plugin et a ajouté l' .min.js dans l'en-tête de page.

    • J'ai fait tout ce que j'ai énuméré seulement la partie de l'jQuery qui doit changer. Le Curseur fonctionne bien, donc je n'ai pas besoin de vérifier les ci-dessus, je ne peux tout simplement un moyen pour ajouter chaque diapositive à s'estomper..
    • Voir JS Bin exemple
    InformationsquelleAutor Filipe Manuel