web-dev-qa-db-fra.com

Définir les attributs CSS en haut et à gauche

Pour une raison quelconque, je ne parviens pas à définir les attributs CSS "supérieur" et "gauche" à l'aide du code JavaScript suivant.

var div = document.createElement('div');
div.style.position = 'absolute';
div.style.top = 200;
div.style.left = 200;
document.body.appendChild(div);

En utilisant Firebug, je peux voir que le div obtient le position réglé sur "absolute" mais les attributs top et left ne sont pas définis!

Ceci est pour Firefox 3.6.

javascriptcoding-style
66
Deniz Dogan
div.style.top = "200px";
div.style.left = "200px";
111
Lyubomyr Shaydariv

Vous pouvez également utiliser la méthode setProperty comme ci-dessous

document.getElementById('divName').style.setProperty("top", "100px");
10
Eralper

div.style donne un objet ( CSSStyleDeclaration ). Puisqu'il s'agit d'un objet, vous pouvez également utiliser les éléments suivants:

div.style["top"] = "200px";
div.style["left"] = "200px";

Ceci est utile, par exemple, si vous devez accéder à une propriété "variable":

div.style[prop] = "200px";
2
rinogo

Nous pouvons créer une nouvelle classe CSS pour div.

 .div {
      position: absolute;
      left: 150px;
      width: 200px;
      height: 120px;
    }
0
serkanbasdag