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 :

Redimensionner des div au chargement de la page


Sujet :

JavaScript

  1. #1
    Membre du Club Avatar de Halex78
    Homme Profil pro
    Ingénieur développement logiciels
    Inscrit en
    Mars 2007
    Messages
    75
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 32
    Localisation : France

    Informations professionnelles :
    Activité : Ingénieur développement logiciels

    Informations forums :
    Inscription : Mars 2007
    Messages : 75
    Points : 68
    Points
    68
    Par défaut Redimensionner des div au chargement de la page
    Bonjour, je souhaite qu'au chargement de ma page, certains soient redimensionnés grâce à un script javascript... Seulement ca ne fonctionne pas, rien n'est redimensionné, et comme des divs sont en position:absolute, ils n'apparaissent pas... Voici mon code :

    Code : 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
    <script type="text/javascript">
    var milieu_corps = document.getElementById('milieu_corps_centre');
     
    var milieu_corps_gauche = document.getElementById('milieu_corps_gauche');
     
    var milieu_corps_droite = document.getElementById('milieu_corps_droite');
     
    var hauteur_div = milieu_corps.offsetHeight;
     
    var hmin = 600;
     
    var hauteur_motif = 203;
     
    var n = Math.ceil((hauteur_div - hmin)/hauteur_motif);
     
    If(hauteur_div>hmin)
    {
    	var new_hauteur_div = hmin+n*hauteur_motif;
    }
    else
    {
    	var new_hauteur_div = hmin;
    }
     
    milieu_corps.style.height = new_hauteur_div+"px";
    milieu_corps_gauche.style.height = new_hauteur_div+"px";
    milieu_corps_droite.style.height = new_hauteur_div+"px";
    </script>

  2. #2
    Expert éminent sénior

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Points : 36 571
    Points
    36 571
    Par défaut
    Bonjour,
    il faut que tu transformes ce code en une fonction, et que tu appelles cette dernière sur le onload du <body>

    A+

  3. #3
    Membre du Club Avatar de Halex78
    Homme Profil pro
    Ingénieur développement logiciels
    Inscrit en
    Mars 2007
    Messages
    75
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 32
    Localisation : France

    Informations professionnelles :
    Activité : Ingénieur développement logiciels

    Informations forums :
    Inscription : Mars 2007
    Messages : 75
    Points : 68
    Points
    68
    Par défaut
    Ca ne fonctionne toujours pas

  4. #4
    Expert éminent sénior

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Points : 36 571
    Points
    36 571
    Par défaut


    On peut voir le HTML des div ?

    Si elle n'est pas trop volumineuse, toute la page serait mieux ...

    A+

  5. #5
    Membre expérimenté
    Avatar de gwyohm
    Homme Profil pro
    Développeur informatique
    Inscrit en
    Octobre 2007
    Messages
    925
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : Octobre 2007
    Messages : 925
    Points : 1 333
    Points
    1 333
    Par défaut
    Citation Envoyé par E.Bzz Voir le message
    Bonjour,
    il faut que tu transformes ce code en une fonction, et que tu appelles cette dernière sur le onload du <body>

    A+
    Ca devrait marcher (autre solution :déplacer ton code à la fin de ta page, juste avant le </body>).
    Petite remarque quand même, il y a une majuscule au i de ton if et ca c'est un problème.

  6. #6
    Membre du Club Avatar de Halex78
    Homme Profil pro
    Ingénieur développement logiciels
    Inscrit en
    Mars 2007
    Messages
    75
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 32
    Localisation : France

    Informations professionnelles :
    Activité : Ingénieur développement logiciels

    Informations forums :
    Inscription : Mars 2007
    Messages : 75
    Points : 68
    Points
    68
    Par défaut
    Div html avec le contenu affiché via php (ne pas en tenir compte)
    Code : 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
    <div class="corps_total"> 
     
    <div id="haut_corps"></div>
     
    <div id="milieu_corps_gauche"></div>
     
    <div id="milieu_corps_centre">
    <div>
    <?php 
    //Cr�ation automatique de liens � partir des entr�es du glossaire...
    include('scripts_php/liens_automatiques.php');
    close();
    echo $corpsdepage;
    ?>
    </div>
    </div>
     
    <div id="milieu_corps_droite"></div>
     
    <div id="bas_corps"></div>
     
    </div>
    Le css associé :
    Code : 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
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    div.corps_total
    {
    margin-left:269;
    width : 755px;
    }
     
    div#haut_corps
    {
    position:absolute;
    height:61px;
    width:755px;
    background-image:url('images/page/haut.png');
    }
     
    div#milieu_corps_gauche
    {
    position:absolute;
    margin-top:61px;
    width:42px;
    background-image:url('images/page/bord_gauche.png');
    background-repeat:repeat-y;
    z-index:150;
    }
     
    div#milieu_corps_droite
    {
    position:absolute;
    margin-top:61px;
    margin-left:700px;
    width:42px;
    background-image:url('images/page/bord_droit.png');
    background-repeat:repeat-y;
    }
     
    div#milieu_corps_centre
    {
    position:absolute;
    margin-top:61px;
    background-image:url('images/page/texture_parchemin.jpg');
    margin-left:25px;
    width:700px;
    }
     
    div#milieu_corps_centre div
    {
    margin:25px;
    z-index:151;
    }
     
    div#bas_corps
    {
    height:61px;
    background-image:url('images/page/bas.png');
    }

  7. #7
    Expert éminent sénior

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Points : 36 571
    Points
    36 571
    Par défaut
    Citation Envoyé par gwyohm Voir le message
    il y a une majuscule au i de ton if et ca c'est un problème.
    +1

  8. #8
    Expert éminent sénior

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Points : 36 571
    Points
    36 571
    Par défaut
    Dans le CSS, ce n'est pas la peine de préfixer les ID par "div" : un id étant unique, inutile de spécifier qu'il est dans un div.
    Ca suffit peut être à créer le problème (syntaxe fausse).

    A+

  9. #9
    Membre du Club Avatar de Halex78
    Homme Profil pro
    Ingénieur développement logiciels
    Inscrit en
    Mars 2007
    Messages
    75
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 32
    Localisation : France

    Informations professionnelles :
    Activité : Ingénieur développement logiciels

    Informations forums :
    Inscription : Mars 2007
    Messages : 75
    Points : 68
    Points
    68
    Par défaut
    Wahoo ! C'était bien ça, le "i" du if... Merci beaucoup, je me méfierai désormais plus de la casse (c'est mon premier script javascript != avec php, la casse ya pas à s'en soucier)

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

Discussions similaires

  1. Réponses: 1
    Dernier message: 22/06/2010, 16h09
  2. appliquer une fonction foreach div au chargement de la page
    Par cbalmefrezol dans le forum jQuery
    Réponses: 2
    Dernier message: 21/04/2009, 22h03
  3. Charger des données au chargement de la page
    Par coco-sup dans le forum Struts 2
    Réponses: 2
    Dernier message: 11/04/2008, 11h37
  4. Centrer une page avec des DIV imbriqués
    Par emstar dans le forum Balisage (X)HTML et validation W3C
    Réponses: 7
    Dernier message: 25/04/2006, 18h42
  5. mettre en page avec des div
    Par mathieu_r dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 10/08/2005, 11h35

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