Discussion :

[stanley]

Salut à tous,

J'ai un petit souci, je n'arrive pas à le régler.

En fait, j'ai deux DIV qui contiennent chacun un formulaire de contact différent l'un de l'autre.

Je dois pouvoir sur ma page web basculer d'un formulaire à un autre en cliquant sur un simple bouton radio qui correspond au formulaire de contact en question.

Disons qu'il y a un formulaire qui s'affiche par défaut à l'ouverture de la page et quand on clique sur le bouton radio, l'autre formulaire s'affiche, mais à la même place.

Voilà comment j'ai constitué mon code HTML :

Code html :

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

1
2
3
4
5
6
7
8
9
10
 
<div id="form1">
 
<!-- ICI J'AI MIS LE CODE HTML QUI DEFINI LE FORMULAIRE 1 -->
 
</div>
 
<div id="form2">
<! --ICI J'AI MIS LE CODE HTML QUI DEFINI LE FORMULAIRE 2 -->
</div>

Les deux div viennent l'une après l'autre, et voici la fonction Javascript qui cache ou affiche les formulaires :

Code :

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

1
2
3
4
5
6
7
function MM_showHideLayers() { //v9.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) 
  with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}

Elle marche bien, j'arrive à cacher et faire apparaitre les formulaires en faisant un simple appel de cette fonction avec l'argument "show" ou "hide", mais le problème c'est quand j'essaye d'afficher le formulaire 2, il s'affiche tout en bas en laissant un espace totalement vide.

C'est à dire que par défaut, le formulaire N°1 est affiché sur la page, et quand je clique sur le bouton Radio pour afficher le formulaire 2, le formulaire 1 disparait et le formulaire 2 s'affiche tout en bas au lieu de s'afficher au lieu de premier. Je pense que c'est normal car le DIV du formulaire 1 est en première position dans mon code HTML

Moi je me suis dit que c'est peut être un problème de positionnement grâce aus CSS, mais je ne sais pas comment faire.

Merci pour votre aide sur ce point

[12monkeys]

Bonjour

C'est normal, parce que tu utilises la propriété visibility qui rend une boite invisible, mais cette boite continue à influencer la mise en forme du document. En clair la boite n'est pas visible mais est présente.

Utilise plutôt la propriété display avec la valeur none. Dans ce cas la boite n'est même pas générée et donc ne laissera pas cet espace.

[stanley]

Oui, tu avais raison, ça marche très bien !

Merci