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 :

plugin easyslider. Comment puis-je réaliser deux diaporamas ?


Sujet :

jQuery

  1. #1
    Membre du Club Avatar de Shivas
    Inscrit en
    Juin 2004
    Messages
    126
    Détails du profil
    Informations forums :
    Inscription : Juin 2004
    Messages : 126
    Points : 66
    Points
    66
    Par défaut plugin easyslider. Comment puis-je réaliser deux diaporamas ?
    Bonjour,

    Comment puis-je faire pour utiliser easySlider sur deux diaporamas créer sur la même page ?

    Code actuel

    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/easySlider.js"></script>

    1er diapo

    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
     
    <script language="JavaScript">
       $(document).ready(function(){ 
    	$("#slider").easySlider({
    		auto:		true,
    		continuous: true,
    		prevText: 'Precedent',
    		nextText:'Suivant'
    		/*speed:800,
     
    		orientation: 'horizontal'*/
    	});
    });
    </script>
     
    <div id="slider">
       <ul>
           <li></li>
        </ul>
    </div>
    2eme diapo

    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
     
    <script language="JavaScript">
       $(document).ready(function(){ 
    	$("#slider_mieux_notes").easySlider({
    		auto:		true,
    		continuous: true,
    		prevText: 'Precedent',
    		nextText:'Suivant'
     
    	});
    });
    </script>
     
    <div id="slider_mieux_notes">
       <ul>
           <li></li>
        </ul>
    </div>
    Actuellement lorsque que je clic sur suivant sur mon 1er diapo ça me fait défiler les images du deux diaporamas.
    Merci pour vos réponses.

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 638
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 638
    Points : 66 667
    Points
    66 667
    Billets dans le blog
    1
    Par défaut
    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
     
    <script language="JavaScript">
       $(document).ready(function(){ 
    	$("#slider_mieux_notes_a, ").easySlider({
    		auto:		true,
    		continuous: true,
    		prevText: 'Precedent',
    		nextText:'Suivant'
     
    	});
    	$("#slider_mieux_notes_b, ").easySlider({
    		auto:		true,
    		continuous: true,
    		prevText: 'Precedent',
    		nextText:'Suivant'
     
    	});
     
     
    });
     
    </script>
     
    <div id="slider_mieux_notes_a">
       <ul>
           <li></li>
        </ul>
    </div>
    <div id="slider_mieux_notes_b">
       <ul>
           <li></li>
        </ul>
    </div>
    ??
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  3. #3
    Membre du Club Avatar de Shivas
    Inscrit en
    Juin 2004
    Messages
    126
    Détails du profil
    Informations forums :
    Inscription : Juin 2004
    Messages : 126
    Points : 66
    Points
    66
    Par défaut
    A quoi correspond les ??

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 638
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 638
    Points : 66 667
    Points
    66 667
    Billets dans le blog
    1
    Par défaut
    a des point d'interrogation ...
    an gros la traduction en serait :

    est ce que ceci te convient ?
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  5. #5
    Membre du Club Avatar de Shivas
    Inscrit en
    Juin 2004
    Messages
    126
    Détails du profil
    Informations forums :
    Inscription : Juin 2004
    Messages : 126
    Points : 66
    Points
    66
    Par défaut
    ok je n'avais pas compris.
    J'ai le même comportement avec ton changement

  6. #6
    Membre du Club Avatar de Shivas
    Inscrit en
    Juin 2004
    Messages
    126
    Détails du profil
    Informations forums :
    Inscription : Juin 2004
    Messages : 126
    Points : 66
    Points
    66
    Par défaut
    Une idée ?

  7. #7
    Membre averti
    Profil pro
    Inscrit en
    Novembre 2010
    Messages
    207
    Détails du profil
    Informations personnelles :
    Localisation : France, Indre et Loire (Centre)

    Informations forums :
    Inscription : Novembre 2010
    Messages : 207
    Points : 344
    Points
    344
    Par défaut
    Il suffit de jeter un œil au code du plugin pour s'apercevoir qu'il utilise des Id (qui doivent être unique) sur les liens précédant et suivant.

    D'où l'utilité de deux options disponibles : prevId et nextId
    Sébastien Courjean
    Développeur Web
    scourjean@cyres.fr
    http://www.cyres.fr/

  8. #8
    Membre du Club Avatar de Shivas
    Inscrit en
    Juin 2004
    Messages
    126
    Détails du profil
    Informations forums :
    Inscription : Juin 2004
    Messages : 126
    Points : 66
    Points
    66
    Par défaut
    Oui en effet, j'ai déjà essayé de faire la modification et j'ai le même résultat. Je vous indique les changements effectués.

    J'ai crée un deuxième plugin intitule easySlider1 ou j'ai modifié les variables prevText et nextText par prevText1 et nextText1. J'ai également fait la modification dans les fonctions.

    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
     
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/easySlider.js"></script>
    <script type="text/javascript" src="js/easySlider1.js"></script>
     
     
     
    <script language="JavaScript">
    $(document).ready(function(){ 
     
    	$("#slider_mieux_notes_a, ").easySlider({
     
    		auto:		true,
    		continuous: true,
    		prevText: 'Precedent',
    		nextText:'Suivant'
     
     
    	});
     
     
    	$("#slider_mieux_notes_b, ").easySlider1({
     
    	auto:true,
    	continuous: true,
     
    	prevText1: '<img src=images/fleches/flecheg_04.png border=0>',
    	nextText1:'<img src=images/fleches/flecheg_02.png border=0>'
     
    	});
    });
    Merci

  9. #9
    Membre averti
    Profil pro
    Inscrit en
    Novembre 2010
    Messages
    207
    Détails du profil
    Informations personnelles :
    Localisation : France, Indre et Loire (Centre)

    Informations forums :
    Inscription : Novembre 2010
    Messages : 207
    Points : 344
    Points
    344
    Par défaut
    T'as essayé :
    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
    $("#slider_mieux_notes_a, ").easySlider({
     
    		auto:		true,
    		continuous: true,
    prevId: 'prev1',
    nextId: 'next1',
    		prevText: 'Precedent',
    		nextText:'Suivant'
     
     
    	});
     
     
    	$("#slider_mieux_notes_b, ").easySlider1({
     
    	auto:true,
    	continuous: true,
    prevId: 'prev2',
    nextId: 'next2',
    	prevText1: '<img src=images/fleches/flecheg_04.png border=0>',
    	nextText1:'<img src=images/fleches/flecheg_02.png border=0>'
     
    	});
    Sébastien Courjean
    Développeur Web
    scourjean@cyres.fr
    http://www.cyres.fr/

  10. #10
    Membre du Club Avatar de Shivas
    Inscrit en
    Juin 2004
    Messages
    126
    Détails du profil
    Informations forums :
    Inscription : Juin 2004
    Messages : 126
    Points : 66
    Points
    66
    Par défaut
    Merci beaucoup pour ton aide, ça fonctionne

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

Discussions similaires

  1. Réponses: 4
    Dernier message: 22/07/2012, 22h16
  2. Réponses: 4
    Dernier message: 20/06/2011, 09h50
  3. Réponses: 1
    Dernier message: 16/11/2010, 11h07
  4. plugin Rater. Comment puis-je l'intégrer ?
    Par faq666 dans le forum jQuery
    Réponses: 1
    Dernier message: 04/10/2010, 20h10
  5. Réponses: 3
    Dernier message: 12/07/2010, 22h02

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