Problème de Widget (Slider)

par soul.eater Jeu 29 Mai 2014 - 1:55

Bonjour,

Je fais appel à vos lumières car je rencontre un problème avec un code de slider vidéo, quand j'en met un en place il fonctionne très bien mais lorsque j'en rajoute un deuxième celui-ci n'apparaît pas et je n'en comprend pas la raison.

Merci d'avance pour vos retours à ce sujet.

Voici mes deux codes :

Code:: <script src="http://rdlm.free-h.net/V/Sareth/amazingslider.js"></script> <script src="http://rdlm.free-h.net/V/Sareth/initslider-1.js"></script>  </head> <body> <div style="margin:30px auto;max-width:350px;">  <div id="amazingslider-1" style="display:block;position:relative;margin:16px auto 56px;"> <ul class="amazingslider-slides" style="display:none;"> <li><img src="http://rdlm.free-h.net/V/Sareth/srtB_Klgzvc.jpg" alt="Violent ce jeu ?!?! Pas du tout ! - Hotline Miami Gameplay (FR)" /> <video preload="none" src="http://www.youtube.com/embed/srtB_Klgzvc"></video> </li> <li><img src="http://rdlm.free-h.net/V/Sareth/QPLgW-_aySs.jpg" alt="Soyez maître de l'esprit plutôt que maîtrisé par l'esprit - Shadow Warrior Gameplay (FR)" /> <video preload="none" src="http://www.youtube.com/embed/QPLgW-_aySs"></video> </li> <li><img src="http://rdlm.free-h.net/V/Sareth/tX_dFYJyLRY.jpg" alt="Tout est bruit pour qui a peur - Outlast Gameplay (FR) - Episode 2" /> <video preload="none" src="http://www.youtube.com/embed/tX_dFYJyLRY"></video> </li> <li><img src="http://rdlm.free-h.net/V/Sareth/3uPShA_CLPY.jpg" alt="BOUH ! Ça fait peur ! - Outlast Gameplay (FR)" /> <video preload="none" src="http://www.youtube.com/embed/3uPShA_CLPY"></video> </li> </ul> <div class="amazingslider-engine" style="display:none;"><a href="http://amazingslider.com">jQuery Slideshow</a></div> </div>

Code:: <script src="http://rdlm.free-h.net/V/BFBC2/amazingslider.js"></script> <script src="http://rdlm.free-h.net/V/BFBC2/initslider-1.js"></script>  </head> <body> <div style="margin:30px auto;max-width:350px;">  <div id="amazingslider-1" style="display:block;position:relative;margin:16px auto 56px;"> <ul class="amazingslider-slides" style="display:none;"> <li><img src="http://rdlm.free-h.net/V/BFBC2/scByc6KRK6I.jpg" alt="Les Ramollis De La Molette 2" /> <video preload="none" src="http://www.youtube.com/embed/scByc6KRK6I"></video> </li> <li><img src="http://rdlm.free-h.net/V/BFBC2/nk9qY37dizI.jpg" alt="cascade RdLm.mpg" /> <video preload="none" src="http://www.youtube.com/embed/nk9qY37dizI"></video> </li> <li><img src="http://rdlm.free-h.net/V/BFBC2/A2fFE3a5wGQ.jpg" alt="RdLm quad jump .mpg" /> <video preload="none" src="http://www.youtube.com/embed/A2fFE3a5wGQ"></video> </li> <li><img src="http://rdlm.free-h.net/V/BFBC2/iOJcAl4qWsk.jpg" alt="lapin oasis 2 sur 2" /> <video preload="none" src="http://www.youtube.com/embed/iOJcAl4qWsk"></video> </li> <li><img src="http://rdlm.free-h.net/V/BFBC2/BUQi5VJkxj0.jpg" alt="lapin oasis 1 sur 2" /> <video preload="none" src="http://www.youtube.com/embed/BUQi5VJkxj0"></video> </li> <li><img src="http://rdlm.free-h.net/V/BFBC2/67p6lmqnhao.jpg" alt="LAPIN1 2 sur2" /> <video preload="none" src="http://www.youtube.com/embed/67p6lmqnhao"></video> </li> <li><img src="http://rdlm.free-h.net/V/BFBC2/4SkkyNaUQVE.jpg" alt="LAPIN1 1sur2" /> <video preload="none" src="http://www.youtube.com/embed/4SkkyNaUQVE"></video> </li> <li><img src="http://rdlm.free-h.net/V/BFBC2/fqGP9NbE3Fk.jpg" alt="BBC2 - Un soir avec les Ramollis De La Molette" /> <video preload="none" src="http://www.youtube.com/embed/fqGP9NbE3Fk"></video> </li> </ul> <div class="amazingslider-engine" style="display:none;"><a href="http://amazingslider.com">jQuery Slideshow</a> </div> </div>

par Self Jeu 29 Mai 2014 - 2:07

Bonsoir,

C'est certainement parce que les deux ont le même id dans cette ligne :

Code:: <div id="amazingslider-1" style="display:block;position:relative;margin:16px auto 56px;">

Petit précision, supposant que les deux codes sont sur la même page (comme pour l'id), il n'est pas nécessaire d'appeler deux fois les code javascript :

Code:: <script src="http://rdlm.free-h.net/V/BFBC2/amazingslider.js"></script> <script src="http://rdlm.free-h.net/V/BFBC2/initslider-1.js"></script>

Et petite correction, il faut enlever la balise fermante head et la balise ouvrante body (dans les deux codes) :

Code:: </head> <body>

et ajouter un balise fermante div à la fin du code (toujours dans les deux codes) :

Code:: </div>

par soul.eater Jeu 29 Mai 2014 - 15:56

Merci pour ton aide une nouvelle fois SeLfde.

J'ai modifier l'id d'un des div, il a fallu que je modifie un script qui comporte l'id (http://rdlm.free-h.net/V/BFBC2/initslider-1.js).

Tout fonctionne désormais, je propose les deux codes fonctionnels ici, il suffit de modifier les liens youtube et les images (je doute que quelqu'un remarque mon message mais bon sait-on jamais :

Code:: <script src="sliderengine/jquery.js"></script> <script src="http://rdlm.free-h.net/V/BFBC2/amazingslider.js"></script> <script src="http://rdlm.free-h.net/V/BFBC2/initslider-1.js"></script>  <div style="margin:30px auto;max-width:350px;">  <div style="display:block;position:relative;margin:16px auto 56px;" id="amazingslider-1"> <ul style="display:none;" class="amazingslider-slides"> <li> <img alt="Les Ramollis De La Molette 2" src="http://rdlm.free-h.net/V/BFBC2/scByc6KRK6I.jpg" /> <video src="http://www.youtube.com/embed/scByc6KRK6I" preload="none"></video> </li> <li> <img alt="cascade RdLm.mpg" src="http://rdlm.free-h.net/V/BFBC2/nk9qY37dizI.jpg" /> <video src="http://www.youtube.com/embed/nk9qY37dizI" preload="none"></video> </li> <li> <img alt="RdLm quad jump .mpg" src="http://rdlm.free-h.net/V/BFBC2/A2fFE3a5wGQ.jpg" /> <video src="http://www.youtube.com/embed/A2fFE3a5wGQ" preload="none"></video> </li> <li> <img alt="lapin oasis 2 sur 2" src="http://rdlm.free-h.net/V/BFBC2/iOJcAl4qWsk.jpg" /> <video src="http://www.youtube.com/embed/iOJcAl4qWsk" preload="none"></video> </li> <li> <img alt="lapin oasis 1 sur 2" src="http://rdlm.free-h.net/V/BFBC2/BUQi5VJkxj0.jpg" /> <video src="http://www.youtube.com/embed/BUQi5VJkxj0" preload="none"></video> </li> <li> <img alt="LAPIN1 2 sur2" src="http://rdlm.free-h.net/V/BFBC2/67p6lmqnhao.jpg" /> <video src="http://www.youtube.com/embed/67p6lmqnhao" preload="none"></video> </li> <li> <img alt="LAPIN1 1sur2" src="http://rdlm.free-h.net/V/BFBC2/4SkkyNaUQVE.jpg" /> <video src="http://www.youtube.com/embed/4SkkyNaUQVE" preload="none"></video> </li> <li> <img alt="BBC2 - Un soir avec les Ramollis De La Molette" src="http://rdlm.free-h.net/V/BFBC2/fqGP9NbE3Fk.jpg" /> <video src="http://www.youtube.com/embed/fqGP9NbE3Fk" preload="none"></video> </li> </ul> <div style="display:none;" class="amazingslider-engine"> <a href="http://amazingslider.com">JavaScript Image Slider</a> </div> </div>  </div>

Code:: <script src="http://rdlm.free-h.net/V/Sareth/initslider-2.js"></script> <div style="margin:30px auto;max-width:350px;">  <div style="display:block;position:relative;margin:16px auto 56px;" id="amazingslider-2"> <ul style="display:none;" class="amazingslider-slides"> <li> <img alt="Violent ce jeu ?!?! Pas du tout ! - Hotline Miami Gameplay" src="http://rdlm.free-h.net/V/Sareth/srtB_Klgzvc.jpg" /> <video src="http://www.youtube.com/embed/srtB_Klgzvc" preload="none"></video> </li> <li> <img alt="Soyez maître de l'esprit plutôt que maîtrisé par l'esprit - Shadow Warrior Gameplay" src="http://rdlm.free-h.net/V/Sareth/QPLgW-_aySs.jpg" /> <video src="http://www.youtube.com/embed/QPLgW-_aySs" preload="none"></video> </li> <li> <img alt="Tout est bruit pour qui a peur - Outlast Gameplay - Episode 2" src="http://rdlm.free-h.net/V/Sareth/tX_dFYJyLRY.jpg" /> <video src="http://www.youtube.com/embed/tX_dFYJyLRY" preload="none"></video> </li> <li> <img alt="BOUH ! Ça fait peur ! - Outlast Gameplay" src="http://rdlm.free-h.net/V/Sareth/3uPShA_CLPY.jpg" /> <video src="http://www.youtube.com/embed/3uPShA_CLPY" preload="none"></video> </li> </ul> <div style="display:none;" class="amazingslider-engine"> <a href="http://amazingslider.com">jQuery Slideshow</a> </div> </div> </div>

Problème de Widget (Slider)

Problème de Widget (Slider)

Re: Problème de Widget (Slider)

Re: Problème de Widget (Slider)