Javascript - Установите размер DIV, не дожидаясь окончания загрузки страницы - PullRequest
Новая
       32

Javascript - Установите размер DIV, не дожидаясь окончания загрузки страницы

1 голос
/ 10 декабря 2011

У меня есть DIV. Я хочу настроить его размер в соответствии с размером окна.Итак, у меня есть метод javascript, который возвращает размер новостей для применения.Но я не понимаю, как определить этот размер для div, не дожидаясь окончания загрузки страницы.

Я имею в виду, у меня есть несколько объектов с длительной загрузкой на странице, поэтому, если я использую окно.onload способ установить размер, у меня есть div с неправильным размером в начале, а затем, когда страница загружается, размер div изменяется.Baaad look.

Я хотел бы установить этот размер, как только страница отобразится, с чем-то вроде: 

<div id="myid" style="width:myjavascript_Getcorrectsize();">

Как бы я это сделал?

Ответы [ 2 ]

3 голосов
/ 10 декабря 2011

Вам не нужно ждать события window load или даже событий "готов", которые предоставляют некоторые библиотеки. Просто поставьте свой блок скриптов после рассматриваемого div, и вы сможете получить доступ к этому div через DOM, чтобы установить его размер. E.g.:

<body>
  <div id="target">This is the target, JavaScript makes it 100px wide</div>
  <script>
    (function() {
      var elm = document.getElementById("target");

      elm.style.width = "100px";
    })();
  </script>
</body>

Живая демоверсия

Ссылки:

Тем не менее, если вы можете установить размер с помощью CSS, вам будет лучше. Но я ожидаю, что вы уже обнаружили, что по какой-то причине вы не можете этого сделать.

2 голосов
/ 10 декабря 2011

Самый простой способ - вставить блок <script> в конец документа и выполнить нужный код: 

...
<script>
(function(){ //<-- This part is optional, but recommended if you don't want
             // to leak variables to the global scope
    document.getElementById("myid").style.width = myjavascript_Getcorrectsize();
})();
</script>
</body>

Если вы хотите, чтобы элемент имел определенную относительную ширину, вы также можете использовать относительные единицы вместо JavaScript: 

<div id="myid" style="width:50%">
...