Menu

Slider et musique

astuces72 4260 Messages postés vendredi 15 janvier 2010Date d'inscription 22 février 2018 Dernière intervention - 14 nov. 2017 à 13:17 - Dernière réponse : jordane45 20064 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 22 février 2018 Dernière intervention
- 14 nov. 2017 à 15:18
hello les gens,



J'ai un slider sur un site en javascript, il lit les photos comme ça:
Le slider vient de la: http://www.menucool.com/slider/slider-that-adapts-to-window-height

<div id="ninja-slider">
<div class="slider-inner">
<ul>
<li>
<a class="ns-show" href="/originale1_1_1/P111077205_08_26_max.jpg" rel="nofollow noopener noreferrer" target="_blank" style="-webkit-transform: rotate(0deg);background-size:contain;"></a><div id="div_texte_img">Photo: 5 </div><div id="div_date_img">15 septembre 2017</div>
</li>
<li>
<a class="ns-img" href="/originale1_1_1/P111076305_08_18_max.jpg" rel="nofollow noopener noreferrer" target="_blank" style="-webkit-transform: rotate(0deg);background-size:contain;"></a><div id="div_texte_img">Photo: 4 </div><div id="div_date_img">15 septembre 2017</div>
</li>
<li>
<a class="ns-img" href="/originale4_2_1/20170824_11560613_00_06_max.jpg" rel="nofollow noopener noreferrer" target="_blank" style="-webkit-transform: rotate(0deg);background-size:contain;"></a><div id="div_texte_img">Photo: 11 </div><div id="div_date_img">24 août 2017</div>
</li>
<li>
<a class="ns-img" href="/originale4_2_1/20171029_13552813_00_00_max.jpg" rel="nofollow noopener noreferrer" target="_blank" style="-webkit-transform: rotate(90deg);background-size:1200px;"></a><div id="div_texte_img">Photo: 10 </div><div id="div_date_img">29 octobre 2017</div>
</li>
<li>
<a class="ns-img" href="/originale4_2_1/avec-arriere-112_59_56_max.jpg" rel="nofollow noopener noreferrer" target="_blank" style="-webkit-transform: rotate(90deg);background-size:1200px;"></a><div id="div_texte_img">Photo: 9 </div><div id="div_date_img">10 novembre 2017</div>
</li>
</ul>
</div>
</div>


Il se rempli avec une bdd et par rapport à plusieurs dossiers, ici nous avons le dossier originale1_1_1 et le dossier originale4_2_1 ,et chaque dossier a une musique.

Les musique sont dans chaque dossier image /originaleX_X_X/musique.mp3


Alors la question, que je n'ai pas réussi à résoudre, c'est Comment au moment du diaporama, changer la musique en fonction du dossier ?
Il faudrait qu'au moment du passage sur le dossier suivant, le changement de la musique.



Le slider met à jour l'image en cours dans une div:
<div id="ninja-slider-pager">
<a rel="0" class="active">1</a>
<a rel="1" class="">2</a>
<a rel="2" class="">3</a>
<a rel="3" class="">4</a>
<a rel="4" class="">5</a>
<a rel="5" class="">6</a>
<a rel="6" class="">7</a>
<a rel="7" class="">8</a>
<a rel="8" class="">9</a>
<a rel="9" class="">10</a></div>

et la, la 1ère image, la casse passe à "ns-show"
Il faut donc que je récupère le nom du dossier en temps réel, et là, je bloque sur une fonction ajax ou javascript, pour faire ce changement, alors je me disais que je pouvais recuperer l'id class="active", mais comment ?

le fichier js qui gère le slider:
http://www.menucool.com/slider/ninja-slider/10/ninja-slider.js

Que celui qui a compris me donne une piste.
Merci :)
Afficher la suite 

1 réponse

Répondre au sujet
jordane45 20064 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 22 février 2018 Dernière intervention - 14 nov. 2017 à 15:18
0
Utile
Bonjour,

je me disais que je pouvais recuperer l'id class="active",

Si j'ai bien compris ce que tu veux (pas sûr.. mais bon...)

En jquery :
var elActif = $('#ninja-slider-pager').find('.active');
//répère le rel correspondant
var rel = elActif.attr('rel');

Commenter la réponse de jordane45