Formulaire avec aide javascript [Résolu]

[zanlgor]

voila j'ai longtemps cherché en css et je pense que c'est pas possible.
je voudrai que dans mon formulaire, lorsque l'on clique sur un champ (ce qui correspond a :focus en css) un texte lui correspondant s'affiche. si quelqu'un peut m'aider, juste au niveau du javascript me fournir un code ou un lien vers un tuto

[andry.aime]

Bonjour,

Ta question est un peu vague, tu veux dire afficher un span ou div caché?
Dans ce cas tu peux manipuler l'attribut display.
Ou tu veux un tooltip? Cherche un plugin jQuery.

A+.

[zanlgor]

oui voila un div ou span à caché dès le débus et dès que l'on clique sur un champ, le message qui convient apparaît, mais comment puis-je faire ceci en css comme la balise champ est de type <input /> ? Et aussi au début j'ai testé avec visibility, mais je trouve que ca marche pas très bien, et avec display, j'ai cherché, pour cacher c'est display:none, mais pour afficher je n'ai pas très bien compris ce qu'il faut que je mette

[zanlgor]

voila j'ai testé mais ca ne marche pas avec le display, le texte ne se cache pas
display:none
et avec visibility, pour cacher le texte ca marche bien mais quand je veut l'afficher, ca marche pas
voici le code html

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
#article25 form p .test12{
 
 
position:absolute;
left: 100px;
display:none;
 
}
 
#article25 form p:hover{
 
	display:inline;
 
}

[Bouffe]

Tu peux mettre un ID à ton span ou div caché, et mettre un onFocus sur le champ correspondant.

Code :

1
2
3
4
<input type="texte" name="monChamp" onFocus="document.getElementById('maDiv').style.display='block'" />
<div id="maDiv">
    Ceci est une div cachée
</div>

Tu peux aussi rajouter un onBlur lors de la perte du focus pour cacher de nouveau la div.

[javatwister]

un genre ça? http://javatwist.imingo.net/formibulle.php

pas revu depuis longtemps, et j'avais utilisé des événements "over" plutôt que click ou focus;

[zanlgor]

oui voila, c'est tout a fait ca

[Bouffe]

Le soucis d'utiliser des hover dans ton cas, c'est que si l'utilisateur positionne sa souris en dehors du champs texte pendant qu'il écrit, les indications de la div n’apparaitront pas.

Le onFocus a l'avantage de laisser la div visible le temps que celui-ci écrive, qu'importe la position de sa souris.

[zanlgor]

ouai mais voila mon gros probleme css, comment faire lorsque la personne clique sur un champ, un span s'affiche, puisque c'est contenue ne peuvent être imbriqué car le champ est de type <input />

[zanlgor]

enfaite pour le onblur, je fait pareil que onfocus mais avec none en valeur ?

[Bouffe]

Oui, onBlur est l'inverse de onFocus.

Fais quelques tests, tu comprendras vite.

[javatwister]

eh ben mettons comme ça, en simplifiant:
http://javatwist.imingo.net/formibulle.htm

[zanlgor]

merci beaucoup de votre aide, je vous partage un site qui ma aidé aussi. Et encore un grand merci a tous
http://www.css3create.com