Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1071 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

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

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

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

n°1905096
nero27
Posté le 14-07-2009 à 18:42:34  profilanswer
 

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 :
  1. <script type='text/javascript'>
  2. function afficheBox() {
  3.      $('box').innerHTML='osef';
  4.      $('box').style.display='block';
  5. }
  6. </script>
  7. <div id='box' style='display: none;'>
  8. <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 :
  1. #box {
  2.         position: absolute;
  3.         top: 50%;
  4.         left: 50%;
  5.         margin-left: -250px;
  6.         margin-top: -50px;
  7.         width: 500px;
  8.         height: 100px;
  9.         padding:5;
  10.         margin:0;
  11.         border: 1px solid black;
  12.         background-color: white;
  13. }


 
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
mood
Publicité
Posté le 14-07-2009 à 18:42:34  profilanswer
 

n°1905130
Pascal le ​nain
Posté le 14-07-2009 à 23:34:19  profilanswer
 

position:fixed au lieu de position:absolute ?

n°1905132
nero27
Posté le 15-07-2009 à 00:03:57  profilanswer
 

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

n°1905197
Pascal le ​nain
Posté le 15-07-2009 à 10:08:36  profilanswer
 

A ton service ;)


Aller à :
Ajouter une réponse
  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 swfProblème avec le rafraichissement d'une page
mise en page sous joomla 1.5Afficher 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 vbspage 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


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR