IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Hauteur d'une DIV en fonction d'une autre DIV via JavaScript


Sujet :

JavaScript

  1. #1
    Membre actif
    Avatar de friendofweb
    Homme Profil pro
    Amateur en informatique
    Inscrit en
    Mai 2015
    Messages
    153
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Amateur en informatique
    Secteur : Santé

    Informations forums :
    Inscription : Mai 2015
    Messages : 153
    Points : 244
    Points
    244
    Par défaut Hauteur d'une DIV en fonction d'une autre DIV via JavaScript
    Bonjour, je voudrais juste comprendre pourquoi un code Javascript proposé Ici fonctionne Ici, mais pas sur ma machine.

    Voici, je que je peux constater via Firebug :

    Nom : firebug2.jpg
Affichages : 187
Taille : 31,6 KoNom : firebug.jpg
Affichages : 164
Taille : 24,8 Ko

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
     
    <!DOCTYPE html>
    <!-- norme html5 -->
    <html lang="fr">
    	<head>
    		<meta http-equiv ="content-type" content="text/html; charset=UTF-8" />
    		<title>Hauteur d'une div</title>
    		<link rel="stylesheet" type="text/css" href="test.css" />
    		<script type="text/javascript">
                            var blocMenu = document.getElementById("menu");
                            var blocContenu = document.getElementById("contenu");
                            
                            blocMenu.style.height=blocContenu.clientHeight + "px";
                    </script>
    	</head>
    	<body>		 
    	<div id="menu">
      	ici le menu. Je voudrais que la hauteur de cette DIV soit la même que la DIV "contenu"
    	</div>
    	<div id="contenu">
      	La hauteur des pages qui saffichent varient
      	<p>
      		Nunc rhoncus vulputate arcu vitae congue. Proin id nulla turpis. Sed consequat orci id convallis tempor. Fusce libero erat, congue at vehicula a, congue at elit. Integer volutpat malesuada ipsum, ut posuere risus finibus non. Morbi in aliquet sem. Sed
        	a neque velit. Praesent suscipit felis nulla, ut varius turpis mollis in. Quisque in lectus eu nulla laoreet cursus molestie sed odio. Ut consequat sed elit ut ultricies. Suspendisse orci est, porta in nisi in, blandit cursus sapien. Praesent viverra
        	lobortis justo aliquet maximus.
        </p>
      	<p>
      		Nunc rhoncus vulputate arcu vitae congue. Proin id nulla turpis. Sed consequat orci id convallis tempor. Fusce libero erat, congue at vehicula a, congue at elit. Integer volutpat malesuada ipsum, ut posuere risus finibus non. Morbi in aliquet sem. Sed
        	a neque velit. Praesent suscipit felis nulla, ut varius turpis mollis in. Quisque in lectus eu nulla laoreet cursus molestie sed odio. Ut consequat sed elit ut ultricies. Suspendisse orci est, porta in nisi in, blandit cursus sapien. Praesent viverra
        	lobortis justo aliquet maximus.
        </p>
    </div>
    	<p style="display:none"> invisible text </p>
    	<a href="http://codepen.io/anon/pen/avbENm">test avec codepen</a>
    	<br />
    	<a href="http://www.developpez.net/forums/d1540236/webmasters-developpement-web/mise-page-css/hauteur-d-div-fonction-d-div/">discution sur le forum</a>
    	</body>
    </html>

    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    #menu {
    	border:1px solid silver;
    	                 }
    #contenu {
        /* height:100px; */
        border:1px solid silver;
    	}

    Comme, j'ai l'intention d'apprendre le Javascript dans un futur proche, je me permets de vous poser la question. J'imagine que pour vous ça ne doit pas être compliqué.

    D'avance, merci pour votre aide.

  2. #2
    Membre confirmé
    Avatar de Jacques Beauregard
    Homme Profil pro
    Développeur Java
    Inscrit en
    Mai 2015
    Messages
    231
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 36
    Localisation : France, Yvelines (Île de France)

    Informations professionnelles :
    Activité : Développeur Java
    Secteur : Conseil

    Informations forums :
    Inscription : Mai 2015
    Messages : 231
    Points : 595
    Points
    595
    Par défaut
    Bonjour,

    Ton script est déclaré avant l'initialisation des balises HTML <div id="menu"> et <div id="contenu">
    D'où les "Null"

  3. #3
    Membre actif
    Avatar de friendofweb
    Homme Profil pro
    Amateur en informatique
    Inscrit en
    Mai 2015
    Messages
    153
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Amateur en informatique
    Secteur : Santé

    Informations forums :
    Inscription : Mai 2015
    Messages : 153
    Points : 244
    Points
    244
    Par défaut
    Merci !

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Hauteur d'une DIV en fonction d'une autre DIV
    Par philippef dans le forum Mise en page CSS
    Réponses: 11
    Dernier message: 01/09/2015, 19h30
  2. Afficher une div en fonction d'une variable, sans rechargement de page
    Par skurseb dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 13/02/2012, 10h23
  3. Afficher/Cacher une div en fonction d'une ligne
    Par student_php dans le forum jQuery
    Réponses: 0
    Dernier message: 13/11/2011, 11h55
  4. [MySQL] modifier une div en fonction d'une rubrique
    Par Stéph utilisateur d'acces dans le forum PHP & Base de données
    Réponses: 0
    Dernier message: 21/06/2011, 19h23
  5. Réponses: 2
    Dernier message: 11/02/2010, 15h29

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo