petit formulaire sur un lien

**Interface** · 25/01/2009, 21h07

Bonsoir

J'ai une barre de menu et j'aimerais que sur 3 liens au survole de la souris un petit formulaire apparaisse pour effectuer une action spécifique. En javascript comment le faire?

**le_chomeur** · 25/01/2009, 21h32

met tes formulaires dans des div que tu afficheras au survol de tes lien

**Interface** · 25/01/2009, 21h38

S'il te plaît veux tu être plus claire?? un petit exemple ce serai cool

**le_chomeur** · 26/01/2009, 00h14

Code :

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

1
2
3
<a href="#" onmouseover="this.getElementsByTagName('div')[0].style.display='block'">ton lien
<div style="display:none">ton formulaire ici</div>
</a>

et pour le mouse out tu remplaces block par none

**Auteur** · 26/01/2009, 01h08

Envoyé par le_chomeur

Code :

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

1
2
3
<a href="#" onmouseover="this.getElementsByTagName('div')[0].style.display='block'">ton lien
<div style="display:none">ton formulaire ici</div>
</a>

et pour le mouse out tu remplaces block par none

ooooh

Le chômeur : une balise <div> (type block) dans lien (type inline), tu n'as pas honte ??

Ce n'est pas valide W3C.

Je préfère ceci :

Code :

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

1
2
<a href="#" onmouseover="this.getElementsByTagName('div')[0].style.display='block'">ton lien</a>
<div style="display:none">ton formulaire ici</div>

**Interface** · 26/01/2009, 01h12

ok merci pour le tuyo mais j'aimerais plutot cliquer que survoler. Alors onclick fera l'affaire mon blème dans ce cas c'est comment fait partir le formulaire si j'ai pas besoin genre onmouse out.

POur onclick qu'est ce qui correspond?

**Bovino** · 26/01/2009, 02h13

Code :

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

1
2
<a href="#" onclick="document.getElementsById('test').style.display=document.getElementsById('test').style.display=='block'?'none':'block';return false">ton lien</a>
<div style="display:none" id="test">ton formulaire ici</div>

**Interface** · 26/01/2009, 02h58

merci chers modérateur(S)

Mais je vois que pour faire partir le formulaire si on na pas besoin on doit recliquer sur le lien sinon si on click ailleur il bouge pas . Cette dernière est-ce possible??

**le_chomeur** · 26/01/2009, 10h03

Envoyé par Auteur

ooooh

Le chômeur : une balise <div> (type block) dans lien (type inline), tu n'as pas honte ??

Ce n'est pas valide W3C.

HO MY GOD !!! une balise non autonome dans un lien :'(

je m'excuse, il était tard, j'avais bu et ... lol mouai j'sais pas pourquoi j'ai fais ça ...

pour masquer ton formulaire il te faut rajouter un évènement sur le document :

doncument.onclick

qui va aller vérifier si une de tes div avec comme classe css (c'est un conseil) est visible , si oui tu le masque sinon tu ne fais rien.

Je pense que cela dépasse un peu tes compétences en javascript, donc si tu n'y arrive pas nous t'aideront

**Interface** · 26/01/2009, 14h41

Bonjour

effectivement ça me dépasse

alors un petit exemple ça m'irai. Merci

**le_chomeur** · 26/01/2009, 14h53

essaye ça

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
19
20
21
22
23
24
25
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
		<title>Untitled Document</title>
		<script type="text/javascript">
			function affiche(avoir){
				var nbDeFormulaire = 3;
				for(i=1 ; i < nbDeFormulaire+1 ; i++){
					document.getElementById('form_n'+i).style.display = "none";
				}
				document.getElementById(avoir).style.display = "block";
			}
		</script>
	</head>
	<body>
		<a href="#" onmouseover="affiche('form_n1')">premier</a>
		<a href="#" onmouseover="affiche('form_n2')">premier</a>
		<a href="#" onmouseover="affiche('form_n3')">premier</a>
		<div id='form_n1'>contenu de ton formulaire 1</div>
		<div id='form_n2'>contenu de ton formulaire 2</div>
		<div id='form_n3'>contenu de ton formulaire 3</div>
	</body>
</html>

petit formulaire sur un lien

JavaScript

Discussions similaires

Partager

Partager