[JQuery] probleme de slideToggle

**timboy11** · 05/07/2008, 16h52

j'ai utilisé le slideToggle pour afficher/cacher des images ça marche tres bien,
mais pour le le champ texte,je veux qu'il soit cacher par defaut comme c le cas pour les images,qu'il se montre pas que si je clique sur affichier.
merci à vous
voila mon code:
/*******************************/
<script type="text/javascript" src="jquery-1.2.6.js"> </script>

<script type="text/javascript">
$(document).ready(function(){
//fonction du clic sur le bouton entrez
$(".entrer").click(function(){
$("#bouge").slideToggle("slow");//"slow","normal","fast" ou durée en milisecondes
});
//fonction du clic sur les boutons voir
$(".voir").click(function(){
$(this).parent().next("<img>").slideToggle("slow");
});
});
</script>
/************************************/
<body>
<div id="bouge">
zone admin : <br /><br />

<br /><br />
<a href="#" class="entrer">Entrer</a>

</div>

<div id='sous'>
<div class='brique'>
<h1>effacer membre<a href="#" class="voir">afficher</a></h1>
<form name=form method=post action="sup membre.php">
entrez le login du membre à effacer<input type="text" name="login" >
</form>
</div>

<div class='brique'>
<h1>image 2 <a href="#" class="voir">afficher</a></h1>
<form name=form method=post action="sup membre.php">
entrez le login du membre à effacer<input type="text" name="login" >
</form>
</div>

<div class='brique'>
<h1>image 3 <a href="#" class="voir">Voir/Cacher</a></h1>
<img src='./sexy_jq00.jpg' alt='coquinou' title='coquinou'>
</div>
</div>
</body>

**Bovino** · 06/07/2008, 09h32

C'est pas très clair...
Déjà, pense à utiliser la balise code (bouton '#'), c'estmieux pour ceux qui lisent ton code

Ensuite, si j'ai bien compris, ce qui te gène, c'est le formulaire...
Si c'est ça, l'erreur vient de là :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(this).parent().next("<img>").slideToggle("slow");

essaye plutôt avec :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(this).parent().next().slideToggle("slow");

**timboy11** · 06/07/2008, 09h52

merci pour ton aide,
ça marche pas,regrade stp l'aperçu,quand j'ouvre la page je clique sur entrer,et il m'affiche la page dans l'aperçu,mait je veux que le champ texte soit caché aussi dés l'ouverture comme les 2 images en bas.
et pour la balise ,e sais pas comment faire,je suis nouveau,j'ai cherche mais r1

**Bovino** · 06/07/2008, 10h00

Si ça ne marche pas avec :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(this).parent().next().slideToggle("slow");

c'est que le slide ne doit pas fonctionner avec un form, essaye donc de mettre ton formulaire dans une div :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<h1>effacer membre<a href="#" class="voir">afficher</a></h1>
<div><form name=form method=post action="sup membre.php">
entrez le login du membre à effacer<input type="text" name="login" >
</form></div>

**timboy11** · 06/07/2008, 12h55

ça marche pas avec div

,mais le slid marche aussi avec les formulaires
puisque je peux le cacher en cliquant sur le lien.

**Bovino** · 06/07/2008, 13h04

Ceci dit, la solution est peut-être de le cacher par défaut :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.forms['form'].hide()

C'est probablement ce que tu dois faire quelque part avec tes images...

**timboy11** · 06/07/2008, 15h28

rien à faire,
regarde ou je l'ai placé.je te remercie pour ton aide

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<script type="text/javascript" src="jquery-1.2.6.js"> </script>

<script type="text/javascript">
$(document).ready(function(){
  //fonction du clic sur le bouton entrez
	$(".entrer").click(function(){
		$("#bouge").slideToggle("slow");//"slow","normal","fast" ou durée en milisecondes
	});
	//fonction du clic sur les boutons voir
	$(".voir").click(function(){
		$(this).parent().next("<img>").slideToggle("slow");
document.forms['form'].hide();


	});
});
</script>

**Bovino** · 06/07/2008, 15h39

Non, il est mal placé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
$(document).ready(function(){
document.forms['form'].hide();
 
  //fonction du clic sur le bouton entrez
	$(".entrer").click(function(){
		$("#bouge").slideToggle("slow");//"slow","normal","fast" ou durée en milisecondes
	});
	//fonction du clic sur les boutons voir
	$(".voir").click(function(){
		$(this).parent().next("<img>").slideToggle("slow");
 
	});
});

**timboy11** · 06/07/2008, 16h41

pas de chance ça marche pas,ça empeche la 1er animation de fonctionner
alors je peux pas voir la couleur mes liens,et je l'ai utilisé ds plusieurs endroits mais r1.

**Bovino** · 06/07/2008, 17h45

Peut-être

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('form').hide();

**numew** · 06/07/2008, 18h49

Essaye en rajoutant dans ton css

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
.brique form
{
  display: none;
}

et dans ton code jQuery

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
$(this).parent().next("<form>").slideToggle("slow");

**Bovino** · 06/07/2008, 18h53

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(this).parent().next("<form>").slideToggle("slow");

1)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

next("form")

2) Le next peut être une balise form ou img, il ne faut donc pas la préciser... d'où :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(this).parent().next().slideToggle("slow");

**timboy11** · 06/07/2008, 18h58

alors la chapeau

,ça marche,merci pour ton aide et bonne soirée

**timboy11** · 06/07/2008, 19h01

c juste ce petit code qui manquait,l'autre marche aussi avec "<img>"

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
.brique form
{
  display: none;
}

merci encore

[JQuery] probleme de slideToggle

jQuery

Discussions similaires

Partager

Partager