Bonjour.
Je manipule du CSS3 depuis déjà pas mal de temps, mais là je tombe sur un problème un peu particulier :
je souhaite faire apparaitre un petit formulaire au milieu de ma page lorsqu'on clique sur un bouton. Rien de bien méchant jusque là, mais pour éviter que le visiteur ait accès au reste de la page lorsque ce formulaire est visible, je fait apparaitre en même temps un fond blanc "de recouvrement" qui recouvre tout (sauf le formulaire) et qui disparaitra en même temps que le formulaire lorsqu'il sera validé.
J'ai donc composé le css de ce <div> de fond comme ça :
Le problème, c'est que quand la page est plus grande que la fenêtre, en hauteur ou en largeur, le fond de recouvrement ne couvre que ce qui se trouve dans la fenêtre au moment du clic. Donc, si le visiteur scroll vers le bas ou vers la droite, il verra un bout de la page non recouverte...
Comment faire donc, pour que ce fond de recouvrement ait les dimensions complètes de la page et non celles de la fenêtre ?
Pour tester, voici l'URL de la page en question : www.marblebook.net
Choisissez n'importe quelle catégorie, n'importe quelle sous-catégorie, puis n'importe quelle société et cliquez sur "Envoyer un mail à cette société" (la plupart des sociétés référencées dans cet annuaire ont ce bouton).
Merci d'avance
Cordialement
Je manipule du CSS3 depuis déjà pas mal de temps, mais là je tombe sur un problème un peu particulier :
je souhaite faire apparaitre un petit formulaire au milieu de ma page lorsqu'on clique sur un bouton. Rien de bien méchant jusque là, mais pour éviter que le visiteur ait accès au reste de la page lorsque ce formulaire est visible, je fait apparaitre en même temps un fond blanc "de recouvrement" qui recouvre tout (sauf le formulaire) et qui disparaitra en même temps que le formulaire lorsqu'il sera validé.
J'ai donc composé le css de ce <div> de fond comme ça :
.fond
{
position: absolute;
top: 0px;
left: 0px;
z-index: 2;
width: 100%;
height: 100%;
background-color: #FFFFFF; /* Pour les anciens navigateurs */
background: rgba(255, 255, 255, 0.5);
display: none;
}
Le problème, c'est que quand la page est plus grande que la fenêtre, en hauteur ou en largeur, le fond de recouvrement ne couvre que ce qui se trouve dans la fenêtre au moment du clic. Donc, si le visiteur scroll vers le bas ou vers la droite, il verra un bout de la page non recouverte...
Comment faire donc, pour que ce fond de recouvrement ait les dimensions complètes de la page et non celles de la fenêtre ?
Pour tester, voici l'URL de la page en question : www.marblebook.net
Choisissez n'importe quelle catégorie, n'importe quelle sous-catégorie, puis n'importe quelle société et cliquez sur "Envoyer un mail à cette société" (la plupart des sociétés référencées dans cet annuaire ont ce bouton).
Merci d'avance
Cordialement