Récuperer la position d'une classe html par JS
Résolu/Fermé
rachidous
Messages postés
5
Date d'inscription
lundi 12 juin 2017
Statut
Membre
Dernière intervention
13 juillet 2018
-
12 juil. 2018 à 21:53
rachidous Messages postés 5 Date d'inscription lundi 12 juin 2017 Statut Membre Dernière intervention 13 juillet 2018 - 13 juil. 2018 à 16:27
rachidous Messages postés 5 Date d'inscription lundi 12 juin 2017 Statut Membre Dernière intervention 13 juillet 2018 - 13 juil. 2018 à 16:27
A voir également:
- Récuperer la position d'une classe html par JS
- Recuperer video youtube - Guide
- Comment récupérer un compte facebook piraté - Guide
- Recuperer message whatsapp - Guide
- Comment récupérer une adresse mail - Guide
- Récupérer photo instagram - Guide
2 réponses
ThEBiShOp
Messages postés
8378
Date d'inscription
jeudi 22 mars 2007
Statut
Contributeur
Dernière intervention
8 février 2021
1 565
13 juil. 2018 à 08:45
13 juil. 2018 à 08:45
Salut,
tu peux commencer par montrer ce que tu as déjà ? ça sera plus simple de t'aiguiller.
Ensuite, l'indice de classe dont tu parles, il est porté à quel niveau ? Dans quelle propriété de ton éléments HTML ?
tu peux commencer par montrer ce que tu as déjà ? ça sera plus simple de t'aiguiller.
Ensuite, l'indice de classe dont tu parles, il est porté à quel niveau ? Dans quelle propriété de ton éléments HTML ?
ThEBiShOp
Messages postés
8378
Date d'inscription
jeudi 22 mars 2007
Statut
Contributeur
Dernière intervention
8 février 2021
1 565
13 juil. 2018 à 08:50
13 juil. 2018 à 08:50
Si tu le fais en jQuery par exemple, ça peut ressembler à ça :
https://jsfiddle.net/zb0cqgav/4/
https://jsfiddle.net/zb0cqgav/4/
rachidous
Messages postés
5
Date d'inscription
lundi 12 juin 2017
Statut
Membre
Dernière intervention
13 juillet 2018
Modifié le 13 juil. 2018 à 13:12
Modifié le 13 juil. 2018 à 13:12
salut , merci d'abord pour ta réponse , en effet ce que je veux faire c'est un système de note à étoiles pour mon blog , il y'a 5 étoiles , et quand je passe la souris sur la première étoile elle change de couleur ( seulement dans l’événement hover ) , si je survole la souris sur le second élément ( la premiere et deuxieme etoile changent de couleur ) ...... ainsi comme ca jusqu'au 5eme étoile aussi ( si je survole la souris sur la 5eme etoile ; les etoiles 1,2,3,4 et 5 change de couleur ).
J'ai utilisé la bibliothèque jquery pour cet exemple , mon code disons est comme ca :
je récuprere var n= l'indice de classe ( le nombre ) et puis pour var i allant de 0à n , je change la couleur de note_etoile[i]
*
<span class="note_etoile">premiere étoile</span>
<span class="note_etoile">deuxieme etoile</span>
<span class="note_etoile">troisieme étoile</span>
<span class="note_etoile">4 eme étoile</span>
<span class="note_etoile">5 éme étoile</span>
<script src="..../jquery...">
<script>
$(".note_etoile").hover(function(){
$(this)???(fct recuprer le numero n) <<<<--------- ???
for(i=0;i<n;i++)
{document.getElementsByClassName["note_etoile"][i].style.color="red";}
})
</scriipt>
*
J'ai utilisé la bibliothèque jquery pour cet exemple , mon code disons est comme ca :
je récuprere var n= l'indice de classe ( le nombre ) et puis pour var i allant de 0à n , je change la couleur de note_etoile[i]
*
<span class="note_etoile">premiere étoile</span>
<span class="note_etoile">deuxieme etoile</span>
<span class="note_etoile">troisieme étoile</span>
<span class="note_etoile">4 eme étoile</span>
<span class="note_etoile">5 éme étoile</span>
<script src="..../jquery...">
<script>
$(".note_etoile").hover(function(){
$(this)???(fct recuprer le numero n) <<<<--------- ???
for(i=0;i<n;i++)
{document.getElementsByClassName["note_etoile"][i].style.color="red";}
})
</scriipt>
*
ThEBiShOp
Messages postés
8378
Date d'inscription
jeudi 22 mars 2007
Statut
Contributeur
Dernière intervention
8 février 2021
1 565
13 juil. 2018 à 14:06
13 juil. 2018 à 14:06
Tu peux utiliser la fonction .index() en jQuery pour connaitre sa position dans un set d'éléments :
https://api.jquery.com/index/
https://api.jquery.com/index/
rachidous
Messages postés
5
Date d'inscription
lundi 12 juin 2017
Statut
Membre
Dernière intervention
13 juillet 2018
13 juil. 2018 à 16:27
13 juil. 2018 à 16:27
merci ça vient de marcher , je l'avais utilisé pour une première fois , peut être je l'avais mal utilisé , maintenant ça marche , la solution est enfin comme ça :
<script>
$(".note_etoile").hover(function(){
{
alert($(this).index());
})
</script>
<script>
$(".note_etoile").hover(function(){
{
alert($(this).index());
})
</script>