$(".nom-class").hover pour 1 seul element

[redah75]

Bonjour et bonne année

je sais que le titre n'est pas parlant, mais je m'explique:
j'afficher en html des vignettes:

Code :

1
2
3
4
5
6
<div class="non-class">
	contenu
	<div class="nom-class2">
		autre contenu
	</div>
</div>

et puis j'ai mis le code javascrpt suivant:

Code :

1
2
3
4
5
6
7
8
$(".nom-class").hover(
	function () {
		$(".nom-class2").fadeTo(500, 1);
	}, 
	function () {
		$(".nom-class2").fadeTo(500, 0);
	}
);

mais ce que je souhaiterais faire est d'afficher l'element de nom-class2 de UNIQUEMENT la vignette survolée.

Auriez vous une idée??

MErci beaucoup

[SpaceFrog]

Code :

1
2
3
4
5
6
7
8
$(".nom-class").hover(
	function () {
		$(this).fadeTo(500, 1);
	}, 
	function () {
		$(this).fadeTo(500, 0);
	}
);

[redah75]

Merci SpaceFrog pour ta reponse tres rapide.

ce que tu me propose ne marchera pas car l'element declencheur n'est pas la cible.
la cible est un element enfant de l'element declencheur:

Code :

1
2
3
4
5
6
<div class="div-declencheur">
	contenu
	<div class="div-cible">
		autre contenu
	</div>
</div>

[SpaceFrog]

ha ben avec la structure html on voit tout de suite mieux

Code :

1
2
3
4
5
6
7
8
$(".nom-class").hover(
	function () {
		$(this).children(".nom-class2").fadeTo(500, 1);
	}, 
	function () {
		$(this).children(".nom-class2").fadeTo(500, 0);
	}
);

par contre tu n'aurais pas inversé les paramètres de fadeTo ?

[redah75]

MILLE MERCIIIIII )

ar conttre tu n'aurais pas inversé les parmètres de fadeto ?

non, je pense pas! http://api.jquery.com/fadeTo/

Merci encore une fois a toi et a jQuery qui nous rend la vie en rose

[SpaceFrog]

arf en effet les paramètres sont dans le bon ordre, je confonds avec animate qui prend le duration en second paramètre

[redah75]

une petite question de curiosité: me coseilles tu d'utiliser hover() ou plutot mouseenter() & mouseleave() ??

[SpaceFrog]

personnellement je n'ai eu que des soucis avec hover
j'utilise mouseenter et mouseleave assortis d'un stop() pour éviter la pile d'évènements

[redah75]

ah! quel genre de soucis??
et quel est l'interet du stop() ?

[SpaceFrog]

si tu passe la souris de nombreuses fois rapidement au dessus de l'objet, tu créées une pile de hover qui vont s'executer à la suite...
le stop vide la pile, et evite d'avoir une animation qui dure 3 heures ...

[redah75]

ah ouais, t'as bien raison, mais toi aussi tu cherches la bete noire )

et comment ferais tu a ta maniere ce que je viens de faire??

Code :

1
2
3
4
5
6
7
8
$(".prod-thumbnail").hover(
	function () {
		$(this).children(".view").fadeTo(500, 1);
	}, 
	function () {
		$(this).children(".view").fadeTo(500, 0);
	}
);

[SpaceFrog]

Code :

1
2
3
4
5
6
7
8
9
$(".prod-thumbnail").mouseenter(
	function () {
		$(this).children(".view").stop(true).fadeTo(500, 1);
	})
 $(".prod-thumbnail").mouseleave(
	function () {
		$(this).children(".view").stope(true).fadeTo(500, 0);
	}
);

[redah75]

Genial, merci beaucoup

et est ce que ceci risque de buger ??:

Code :

1
2
3
4
5
6
7
8
$(".prod-thumbnail").mouseenter(
	function () {
		$(this).children(".view").stop(true).fadeTo(500, 1);
	}).mouseleave(
	function () {
		$(this).children(".view").stop(true).fadeTo(500, 0);
	}
);

et SI JAMAIS je change plus tard la structure html des div et que le div.view redescend d'un niveau ou 2, le $(this).children(".view") ne marche apparement plus, y a t il moyen de dire a jquery que c'est le div.view du $(this) qui m'interesse??

[SpaceFrog]

non ça ne buggera pas...

si ton div view descend de niveau dans ton div essaye avec find()

[redah75]

non ça ne buggera pas...

ma question n'etait pas complete
et donc, me recommandes tu d'utiliser a ta maniere ou a la mienne??

Merci pour le find()

[SpaceFrog]

personnellement je préfère la mienne ...
surprenant non ??

Juste pour des raisons de clarté du code et de maintenance

[redah75]

eh ben je garde la tienne alors
merci pour tout et te souhaite une excellente annee 2011