Avatar
John Ronald Reuel Tolkien:22. května 19:39

Zdravím,
naprosto nechápu proč to nefunguje...

<!DOCTYPE html>
<html lang='cs'>

  <body>
   <script>
      window.onload=function()
      {

      var sirka=document.getElementById("div1").style.width;
      alert(sirka);
        }

      </script>
      <div id="div1" class="a">
          dsa
      </div>
      <div id="div2" class="a">
          as
      </div>
      <div id="div3" class="a">
         das
      </div>

      <style>
      #div1, #div2
      {
      border:2px solid black;
      width:350px;
      height:20px;

      }
      #div3
      {
      border:2px solid black;
      width:200px;
      height:20px;

      }

      </style>

  </body>
</html>

Je tam chyba, nebo je to jen nějaký zásek ?

Editováno 22. května 19:41
 
Odpovědět 22. května 19:39
Avatar
Jurajs
Člen
Avatar
Odpovídá na John Ronald Reuel Tolkien
Jurajs:22. května 20:18

Pokud to má vypisovat jen sirku, tak to zkus udělat takhle:

var w = 100;
sirka = document.getElementById("ctverec");
sirka.style.width = w;
alert(w);

// A nebo takhle, tohle je tvuj priklad
var w = 100;
document.getElementById("ctverec").style.width = w;
alert(w);
Editováno 22. května 20:21
 
Nahoru Odpovědět 22. května 20:18
Avatar
John Ronald Reuel Tolkien:22. května 20:31

Ne to ne, akorát to vypíše velikost té proměnné w.

 
Nahoru Odpovědět 22. května 20:31
Avatar
Jurajs
Člen
Avatar
Odpovídá na John Ronald Reuel Tolkien
Jurajs:22. května 21:06

A co teda? Nějak nechápu?
Pokud chceš měnit šířku v JS pomocí proměnné, tak ten(dejme tomu čtverec) musíš vytvořit pomocí JS a ne v CSS...
Všechny hodnoty co jsi mu nastavil v CSS, nastavíš v JS...Záleží o co ti vlastně jde? Nějak teď nechápu čeho chceš docílit? :) :)

Editováno 22. května 21:09
 
Nahoru Odpovědět 22. května 21:06
Avatar
John Ronald Reuel Tolkien:22. května 21:11

Nechci měnit proměnnou, chci jen vypsat šířku objektu, popřípadě uložit do proměnné. (V mém příkladu ji chci jen vypsat do alertu)

 
Nahoru Odpovědět 22. května 21:11
Avatar
Jurajs
Člen
Avatar
Odpovídá na John Ronald Reuel Tolkien
Jurajs:22. května 21:17

Myslis nejak takhle?

//pouzil jsem jen HTML  a JS  :)
var w = 100;
var h = 100;

var c = document.getElementById("ctverec");
c.style.background= "blue";
c.style.width = w + "px";
c.style.height = h + "px";
alert(w);
c.appendChild();
Editováno 22. května 21:18
 
Nahoru Odpovědět 22. května 21:17
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:23. května 7:46

To je slozitejsi problem.


document.getElementById("div1").style.width

Tohle funguje, pokud existuje <id="div1" width="123">


document.getElementById("div1").style.offsetWidth

Tohle by melo byt univerzalnejsi. Ale muze to sirku spatne pocitat pro marginy nebo paddingy. Nevim jesli oboje nebo jen jedno z toho.


<style>

To jsem nikdy nepouzil. Ale da se k tomu nejak dostat.


Vykopirovane kousky kodu z ruznych stranek...
google = javascript get width from style tag

document.getElementById('banner-contenedor').clientWidth

w=this.offsetWidth

window.getComputedStyle(elem).width

function getInnerWidth(elem) {
    var style = window.getComputedStyle(elem);
    return elem.offsetWidth - parseFloat(style.paddingLeft) - parseFloat(style.paddingRight) - parseFloat(style.borderLeft) - parseFloat(style.borderRight) - parseFloat(style.marginLeft) - parseFloat(style.marginRight);
}

$("#banner-contenedor").css('width'); // jquery

yourItem.style['cssProperty']
Editováno 23. května 7:48
 
Nahoru Odpovědět 23. května 7:46
Avatar
Odpovídá na John Ronald Reuel Tolkien
Vladislav Ladicky:23. května 9:09

Tiež som sa s tým kedysi natrápil. Nepamätám si už vysvetlenie, že prečo je to tak, ale proste nemôžeš čítať element.style­.width, ale iba element.width, bez style. A pri zápise zasa nemôžeš meniť element.width, ale meniť to už musíš so style, napríklad element.style.width = 32 + 'px'.

 
Nahoru Odpovědět 23. května 9:09
Avatar
Odpovídá na John Ronald Reuel Tolkien
Vladislav Ladicky:23. května 9:16

Jo. A ak ťa však zaujíma nie šírka elementu, ale pridelený štýl v <style> , musíš to čítať cez getComputedStyle. Aj s príkladmi to máš vysvetlené na MDN: https://developer.mozilla.org/…omputedStyle

 
Nahoru Odpovědět 23. května 9:16
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:23. května 14:59

Ono je to zpusobeno tim, jak to prohlizec renderuje. On neco dava primo na screen a neco do javascriptoveho element-stromu. Neni vsude vsechno. js - jquery je v tomhle vic univerzalnejsi. Cili, cely problem by bylo mozne vyresit i pres jquery.

 
Nahoru Odpovědět 23. května 14:59
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 10.