Изменение размера div игнорируется - PullRequest
0 голосов
/ 11 сентября 2018

У меня очень простая веб-страница, которая загружает данные с сервера в s как контейнеры. Проблема в том, что иногда изображения слишком высокие, переполняются и вызывают проблемы с макетом. Итак, я искал, чтобы изменить размер div, используя:

target.style.height = height; // As short form of:
document.getElementById('someId').style.height=height;

Но пока НИЧЕГО, что я пробовал, не сработало. Вот HTML-файл:

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <body bgcolor="#E3FBFF" text="#000000" onload="loadImages();">
      <script type = "text/javascript">
        function loadImages()
        {
          ...Function omitted for brevity...
          But it gets to this line:
          document.getElementById(d0).style.height = height+10;
        }
  </script>
    <div id=d0></div>
    <hr>
    <div id=d1></div>
    <hr>
    <div id=d2></div>
    <hr>
    <div id=d3></div>
    <hr>
    </body>
    </html>

Вот и все!

Я нашел различные статьи вроде этой или этой , но они не помогли.

Мне приходит в голову упомянуть, что в моем случае я не требую использования div как таковых. Мне просто нужно, чтобы изображения и связанный текст не перекрывались по вертикали (или по горизонтали). Так как это, когда изображения загружаются, это может быть настоящий беспорядок. ... Как я могу сказать, что мои div должны быть на всю ширину без наложения от других div? Я пытался использовать класс, используя CSS и многое другое, все игнорировалось.

Полагаю, я работал с неверным предположением, что div, как ориентированные на блок вещи, даже если вы объявляете полную ширину ("width = 100%"), может и будет по-прежнему перекрываться вертикально в зависимости от содержимого, помещенного в них.

Ответы [ 2 ]

0 голосов
/ 11 сентября 2018

вы не показали, что вы назначили для 'height', но из вашего кода я предполагаю, что это целое число.

document.getElementById(d0).style.height = height+10;

стиль принимает строку (т. Е. 10px), поэтому присвоение ей номера не будетработать, попробуйте следующее

document.getElementById(d0).style.height = height+10+'px';

javascript преобразует его в строку для вас
подробнее о целых числах в строку здесь Какой лучший способ преобразовать число в строку в JavaScript?

0 голосов
/ 11 сентября 2018

Добавьте единицу к вашей переменной height. Поскольку вы редактируете стиль CSS элемента, это необходимо. См .: MDN

document.getElementById('someId').style.height=height становится: document.getElementById('someId').style.height = height.toString() + 'px'

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...