Показать сообщение отдельно
  #3 (permalink)  
Старый 04.07.2016, 14:00
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,070

колонки одинаковой высоты на js
Chkolnik,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">

.hot{
          border: 1px dashed Gray; padding: 5px; height: 200px; width: 100px ;
          background-color: #00BFFF;
          float: left;
           transition: all 3s ease;
     }
.hot:nth-of-type(2)
 {
    height : 300px; background-color: #FF69B4;
}

.hot:nth-of-type(1)
 {
    height : 100px;  background-color: #FFD700;
}

 </style>


  <script>
window.addEventListener("DOMContentLoaded", function() {
    var divs = document.querySelectorAll(".hot"),
        height = [].reduce.call(divs, function(height, div) {
            return div.scrollHeight > height ? div.scrollHeight : height
        }, 0);
    [].forEach.call(divs, function(el) {
        el.style.height = height + "px"
    })
});
  </script>
</head>

<body>

  <div class="hot"></div>
  <div class="hot"></div>
  <div class="hot"></div>
</body>
</html>

Последний раз редактировалось рони, 04.07.2016 в 14:02.
Ответить с цитированием