Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > JavaScript > Bibliothèques & Frameworks > jQuery
jQuery Forum d'entraide sur le framework jQuery. Avant de poster : Tutoriels jQuery, FAQ jQuery, Tous les tutoriels JavaScript, Toutes les FAQ JavaScript
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 23/03/2011, 23h59   #1
Invité de passage
 
Inscription : octobre 2009
Messages : 22
Détails du profil
Informations forums :
Inscription : octobre 2009
Messages : 22
Points : 0
Points : 0
Par défaut Comment changer la balise style d'un element?

Bonjour tous le monde,

J'ai un script qui affiche des images sur toute la surface de ma page.
Celui-ci genere une liste d'images. Le premier <li> a un style display:list-item
et tous les autres ont un style display:none.

Code :
1
2
3
4
5
6
7
8
<div id="bgstrecher" class="bgstrecher">
      <ul>
            <li class="landscapes bgs-current" style="display:list-item"><img src="path img 1" /></li>
            <li class="landscapes" style="display:none"><img src="path img 2" /></li>
            <li class="landscapes" style="display:none"><img src="path img 3" /></li> 
            <li class="landscapes" style="display:none"><img src="path img 4" /></li> 
      <ul>
</div>
J'ai creer une autre liste similaire a la premiere. Quand je clique sur un element je recupere ca valeur (le chemin d'une image) pour pouvoir le comparer au chemin des images de ma premiere liste. Et ainsi appliquer un nouveau style sur le <li> contenant cette image pour pouvoir afficher l'image.

Code :
1
2
3
4
5
6
<div id="pagination">
      <a class="pagination">path img 1</a>
      <a class="pagination">path img 2</a>
      <a class="pagination">path img 3</a>
      <a class="pagination">path img 4</a>
</div>
Mon script:

Code :
1
2
3
4
5
6
7
8
9
10
11
12
$('#pagination a').live("click", function(){
  linkvalue = $(this).text();
   alert("link : " + linkvalue);
 
 $('#bgstretcher li img').each(function(index) {
 alert(index + ': ' + $(this).attr("src"));
 
                         if ($(this).attr("src") == linkvalue ) { 
       alert ("found");
  }
 });
 });

Mon probleme est que linkvalue n'a pas l'air de fonctionner.
Avez-vous une idee?

Cordialement
designrf est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 24/03/2011, 10h03   #2
Responsable Développement Web

 
Avatar de Bovino
 
Homme Didier Mouronval
Développeur Web
Inscription : juin 2008
Messages : 13 806
Détails du profil
Informations personnelles :
Nom : Homme Didier Mouronval
Âge : 41
Localisation : France, Gironde (Aquitaine)

Informations professionnelles :
Activité : Développeur Web
Secteur : High Tech - Éditeur de logiciels

Informations forums :
Inscription : juin 2008
Messages : 13 806
Points : 35 800
Points : 35 800
Code :
linkvalue = $(this).text();
text() est censé retourné le contenu textuel de l'élément, or dans ta balise, tu as juste une balise image, il n'y a donc aucun texte...
__________________
Pas de question technique par MP !
Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
Vous possédez un blog et aimeriez diffuser vos billets sur le forum, contactez-moi !
Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
Mon livre sur jQuery
Bovino est actuellement connecté   Envoyer un message privé Réponse avec citation 00
Vieux 24/03/2011, 10h19   #3
Rédacteur
 
Avatar de danielhagnoul
 
Homme Daniel Hagnoul
Étudiant perpétuel
Inscription : février 2009
Messages : 3 221
Détails du profil
Informations personnelles :
Nom : Homme Daniel Hagnoul
Âge : 61
Localisation : Belgique

Informations professionnelles :
Activité : Étudiant perpétuel
Secteur : Enseignement

Informations forums :
Inscription : février 2009
Messages : 3 221
Points : 6 767
Points : 6 767
Bonjour

Code :
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
/*
 * Je vous recommande l'utilisation de delegate
 * au lieu de live qui est beaucoup moins performant.
 *
 * Une fonction each offre automatiquement deux paramètres
 * que j'ai l'habitude d'appeler i et item. Mais que l'on
 * dénomme comme l'on veut du moment que l'on s'y retrouve.
 *
 * Je vous recommande l'utilisation de la console des
 * navigateurs IE9, C10 ou F4 (Firebug) pour
 * débogué vos JS.
 *
 * Attenhtion bgstrecher et pas bgstretcher !
 */
$("#pagination").delegate("a", "click", function(){
	var linkvalue = $(this).text();
 
	console.log("link : " + linkvalue);
 
	$("#bgstrecher").find("img").each(function(i, item){
		// console.log(i, item);
 
		console.log(i + ': ' + $(item).attr("src"));
 
		if ($(item).attr("src") == linkvalue){ 
			console.log("found");
		}
	});
});
__________________

FAQ jQuery

Mon cahier d’exercices sur jQuery & Co

Si un message vous a aidé ou vous semble pertinent, votez pour lui !
danielhagnoul est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 24/03/2011, 10h21   #4
Rédacteur
 
Avatar de danielhagnoul
 
Homme Daniel Hagnoul
Étudiant perpétuel
Inscription : février 2009
Messages : 3 221
Détails du profil
Informations personnelles :
Nom : Homme Daniel Hagnoul
Âge : 61
Localisation : Belgique

Informations professionnelles :
Activité : Étudiant perpétuel
Secteur : Enseignement

Informations forums :
Inscription : février 2009
Messages : 3 221
Points : 6 767
Points : 6 767
Citation:
Envoyé par Bovino Voir le message
Code :
linkvalue = $(this).text();
text() est censé retourné le contenu textuel de l'élément, or dans ta balise, tu as juste une balise image, il n'y a donc aucun texte...
Si ! il se réfère à :
Code :
1
2
3
4
5
6
<div id="pagination">
      <a class="pagination">path img 1</a>
      <a class="pagination">path img 2</a>
      <a class="pagination">path img 3</a>
      <a class="pagination">path img 4</a>
</div>
__________________

FAQ jQuery

Mon cahier d’exercices sur jQuery & Co

Si un message vous a aidé ou vous semble pertinent, votez pour lui !
danielhagnoul est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 25/03/2011, 13h32   #5
Invité de passage
 
Inscription : octobre 2009
Messages : 22
Détails du profil
Informations forums :
Inscription : octobre 2009
Messages : 22
Points : 0
Points : 0
Merci pour vos reponses! J'ai resolue mon probleme.

J'utilise .text() car le text de mes balises <a> est en faite un lien absolue.
L'utilisateur ne voit pas le lien mais juste une image qui remplace ce texte en css.

Je ne connaissais pas delegate() merci pour votre conseil.


Merci a vous 2 pour le temps passez!
designrf est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 25/03/2011, 13h38   #6
Rédacteur/Modérateur
 
Avatar de SpaceFrog
 
Homme
Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur
Inscription : mars 2002
Messages : 30 007
Détails du profil
Informations personnelles :
Sexe : Homme
Localisation : Royaume-Uni

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

Informations forums :
Inscription : mars 2002
Messages : 30 007
Points : 45 091
Points : 45 091
balise style d'un élément ... ?
des progrès a faire sur la terminologie ...
__________________
Ma page 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


réalisations :www.planet-languages.com|www.saftair.com| www.ouestisol.fr | www.sebemex.fr | www.extramiante.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
SpaceFrog est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 26/03/2011, 15h20   #7
Membre du Club
 
Inscription : août 2008
Messages : 165
Détails du profil
Informations forums :
Inscription : août 2008
Messages : 165
Points : 50
Points : 50
bonjour designrf,
normalement si vous voulez changer un style c'est à l'aide de .css()

et si votre problème est résolut merci de cliquer sur
merciiii
kamclasse est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 21h49.


 
 
 
 
Partenaires

Hébergement Web