IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

Prise de tête sur un plugin jQuery


Sujet :

jQuery

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Homme Profil pro
    Développeur Web
    Inscrit en
    Janvier 2013
    Messages
    11
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2013
    Messages : 11
    Par défaut Prise de tête sur un plugin jQuery
    bonjour a tous,

    Voila plus d'une semaine que je me prends la tete sur un probleme que je rencontre avec un plugin jQuery. J'essai de faire un slider assez simple en fondu. d'ailleurs, il marche tres bien s'il se trouve tout seul sur une page web. Mais des qu'il y en a plusieurs, ils fonctionnent mal...

    Vous remarquerez sur le lien plus bas qu'il se trouve deux slider qui fonctionne avec le meme plugin :

    - le premier ne fonctionne pas comme je le voudrais. En effet il n'est sensé n'y avoir que 3 slides, le quatrieme devrait disparaitre.

    - le deuxieme slider fonctionne tres bien...

    Quelqu'un aurait le courage de m'aider ?

    voici le lien du slider : http://matdev.fr/public/slider/

    et voici le code source :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    (function($) {
     
        $.slider = function(element, options) {
     
            var $this = this,
                $slider = $(element),
                $slide = $('.slide', $slider),
                nbslide = $slide.length,
                i_current = -1,
                i_last = null;
     
            $this.init = function() {
     
                // on cache chaque slide
                $slide.hide();
     
                $this.next();
     
                setInterval(function(){
                    $this.next();
                }, 2000);
     
            };
     
            $this.next = function() {
     
                // index slide actuel
                if(i_current>=nbslide-1){i_current=0}else{i_current++};
     
                // index derniere slide
                i_last = i_current-3;
                if (i_last < 0 ) i_last = nbslide+i_last;
     
                // on lance l'anim 
                animate( i_last, i_current );
     
            };
     
            var animate = function( index_last, index_next ) {
     
                // selection des slides a animer
                $next_slide = $slide.eq(index_next);
                $last_slide = $slide.eq(index_last);
     
                // on reoganise le zindex de chaque slide
                $slide.each(function(index){
                    var  numSlide = i_current-index;
                    if ( numSlide < 0)  numSlide = nbslide + numSlide;
                    $slide.eq( numSlide ).css( 'z-index', nbslide-index );
                });
     
                // on fait apparaitre le slide actuel
                $next_slide.fadeIn(1000, function(){
                    // une fois l'anim fini, on fait disparaitre le dernier slide
                    $last_slide.fadeOut(1000);
                });
     
            };
     
            $this.init();
     
        };
     
        $.fn.slider = function(options) {
     
            return this.each(function() {
                if (undefined == $(this).data('slider')) {
                    var plugin = new $.slider(this, options);
                    $(this).data('slider', plugin);
                }
            });
        };
     
    })(jQuery);
    merci de votre aide !!!!!!!!!!!

  2. #2
    Membre Expert
    Avatar de Kaamo
    Homme Profil pro
    Ingénieur développement logiciels
    Inscrit en
    Avril 2007
    Messages
    1 165
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Ingénieur développement logiciels
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Avril 2007
    Messages : 1 165
    Par défaut
    - le premier ne fonctionne pas comme je le voudrais. En effet il n'est sensé n'y avoir que 3 slides, le quatrieme devrait disparaitre.
    Je vois 5 slides pour le premier dans le lien fourni

  3. #3
    Membre averti
    Homme Profil pro
    Développeur Web
    Inscrit en
    Janvier 2013
    Messages
    11
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2013
    Messages : 11
    Par défaut
    bonjour Kaamo, merci pour votre réponse,

    en effet il y a bien 5 slides mais seulement 3 devraient etre visibles...

  4. #4
    Membre Expert
    Avatar de Kaamo
    Homme Profil pro
    Ingénieur développement logiciels
    Inscrit en
    Avril 2007
    Messages
    1 165
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Ingénieur développement logiciels
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Avril 2007
    Messages : 1 165
    Par défaut
    Pourquoi ? Je ne vois rien d'anormal. Si seulement 3 doivent être visibles alors pourquoi ne pas enlever les 2 dernières et donc en laisser que 3 ?

  5. #5
    Membre averti
    Homme Profil pro
    Développeur Web
    Inscrit en
    Janvier 2013
    Messages
    11
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2013
    Messages : 11
    Par défaut
    ok, pour etre plus clair, je vous ai fait un autre exemple :


    http://matdev.fr/public/slider2/

    le texte, a la fin de l'apparition d'un slide, devrait disparaitre, or cela n'est pas le cas des qu'il y a plusieur spider dans une meme page

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
     
    $next_slide.fadeIn(1000, function(){
     
        // tout ce qui se trouve ici n'est pas pris en compte...
        $last_slide.fadeOut(1000);
        $('p', $next_slide).fadeOut(1000)
     
    });

  6. #6
    Membre Expert
    Avatar de Kaamo
    Homme Profil pro
    Ingénieur développement logiciels
    Inscrit en
    Avril 2007
    Messages
    1 165
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Ingénieur développement logiciels
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Avril 2007
    Messages : 1 165
    Par défaut
    $('p', this).fadeOut(1000); ?? Pour le problème de base, il y a certainement avoir un problème de compteur. Des petits console.log pour voir ce qui se passe dans ces variables.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Problème de CSS sur un plugin jQuery
    Par abc.xyz dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 15/06/2015, 15h14
  2. Vos avis sur mon plugin jQuery "Flight Indicators"
    Par seb_matton dans le forum jQuery
    Réponses: 0
    Dernier message: 05/04/2014, 11h51
  3. Réponses: 4
    Dernier message: 23/10/2006, 09h09

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo