Afficher une div centrée en hauteur sur une page scrollée

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Afficher une div centrée en hauteur sur une page scrollée

nero27

Bonjour,

Je suppose que ce sujet a déjà été abordé, mais je n'arrive pas à trouver d'information intéressante (mes mots-clés sont peut-être mal choisis).

Pour faire simple, je voudrais afficher une div en surimpression lorsqu'un utilisateur clique sur un bouton. Jusque là, rien de compliqué :

Code :

<script type='text/javascript'>
function afficheBox() {
$('box').innerHTML='osef';
$('box').style.display='block';
}
</script>
<div id='box' style='display: none;'>
<input type="button" value="cliquez ici" onclick='afficheBox()' />

Par contre, j'aimerais que cette div apparaisse au centre de la page (en largeur et en hauteur de la zone visible), même si celle-ci a été scrollée.
Pour l'instant, j'utilise du css comme ceci:

Code :

#box {
position: absolute;
top: 50%;
left: 50%;
margin-left: -250px;
margin-top: -50px;
width: 500px;
height: 100px;
padding:5;
margin:0;
border: 1px solid black;
background-color: white;
}

Ca fonctionne pas trop mal, à un détail près : l'image est bien centrée en largeur, mais il faut remonter quand la page a été scrollée.

Je pense qu'il va falloir faire ça en js, mais étant débutant, je ne vois pas vraiment comment faire : pourriez-vous m'aider ?

Merci d'avance :jap:

Message édité par nero27 le 14-07-2009 à 18:53:03

Publicité

Pascal le nain

position:fixed au lieu de position:absolute ?

nero27

Ah, super, je ne connaissais pas et effectivement, c'est exactement ça qu'il me fallait :jap:

[:spikler]

Pascal le nain

A ton service

FORUM HardWare.fr

Programmation

HTML/CSS

Afficher une div centrée en hauteur sur une page scrollée

Sujets relatifs
[AS2] Recuperer le lien d'une page contenant le swf	Problème avec le rafraichissement d'une page
mise en page sous joomla 1.5	Afficher texte au survol javascript
Définition exacte d'une page profonde ?	exec() depuis une page php sur un serveur unix mandriva
Ecrire une page html en vbs	page sécurisée avec htaccess reste accessible dès l'ouverture
preg_replace sur page perso sfr : comment contourner le pb ?	créer une pixel page
Plus de sujets relatifs à : Afficher une div centrée en hauteur sur une page scrollée

Page générée en 0.018 secondes