Aller au contenu
  • Pas encore inscrit ?

    Pourquoi ne pas vous inscrire ? C'est simple, rapide et gratuit.
    Pour en savoir plus, lisez Les avantages de l'inscription... et la Charte de Zébulon.
    De plus, les messages que vous postez en tant qu'invité restent invisibles tant qu'un modérateur ne les a pas validés. Inscrivez-vous, ce sera un gain de temps pour tout le monde, vous, les helpeurs et les modérateurs ! :wink:

alex.hitman

[Javascript] position suivant un autre calque

Messages recommandés

Bonjour, je possède une page web et j'aimerais faire ceci :

 

J'ai un bloc en position absolue (id="contenu") (donc un calque), dont les propriétés sont définies en CSS.

J'ai ensuite un autre calque que je voudrais positionner suivant le précédent.

 

 

Pour cela, j'essai par du javascript mais je n'y arrive pas trop (je préfère le PHP :P.

 

J'essai de faire que la position top du 2ème calque soit égale à celle du premier+la hauteur du premier+50 si cela est supérieur à 800.

Sinon sa position top vaut 800.

 

J'ai donc ceci dans le 2ème calque :

 

<script language="javascript">
haut = document.getElementById("contenu").style.top.value;
hauteur = document.getElementById("contenu").style.height.value;

if (haut+hauteur+50 > 800)
{
nombre = haut+hauteur+50;
}
else
{
nombre = 800;
}

this.style.top = nombre+px;
</script>

 

Mais bon, sans succès.

 

Y-a-t'il une erreur dans mon code ?

Dois-je définir les propriétés dans le HTML au lieu du CSS ?

 

 

Merci d'avance.

Modifié par alex.hitman

Partager ce message


Lien à poster
Partager sur d’autres sites

Bon...

 

Je suppose que si tu ne veux/peux pas le faire en PHP c'est parce que la hauteur du premier "calque" n'est pas fixe et que tu dois t'appuyer sur ce que le navigateur va générer pour positionner le second.

 

Première remarque, si tu n'étais pas en positionnement absolu, tu pouvais facilement positionner tes "calques" en appliquant le style suivant à celui "du bas" : { clear: both; margin-top: 50px; }

 

Seconde remarque, le positionnement en passant par le DOM est soumis au bon vouloir du navigateur. Si tu utilises le mode quirks tu as des chances de t'en tirer, mais si tu as indiqué un doctype (mode de compatibilité) tu risques d'avoir des ennuis. J'ai fait des tests de positionnement CSS + DHTML et il ressort que certaines propriétés ne sont pas toujours accessibles.

 

Troisième remarque : si l'utilisateur change la taille de sa police, ta mise en page va être mise à mal...

Partager ce message


Lien à poster
Partager sur d’autres sites

Créer un compte ou se connecter pour commenter

Vous devez être membre afin de pouvoir déposer un commentaire

Créer un compte

Créez un compte sur notre communauté. C’est facile !

Créer un nouveau compte

Se connecter

Vous avez déjà un compte ? Connectez-vous ici.

Connectez-vous maintenant

  • En ligne récemment   0 membre est en ligne

    Aucun utilisateur enregistré regarde cette page.

×