Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Как узнать максимальную высоту блока? (https://javascript.ru/forum/dom-window/21117-kak-uznat-maksimalnuyu-vysotu-bloka.html)

frost18 29.08.2011 18:52

Как узнать максимальную высоту блока?
 
Есть много товаров с их наименованиями к примеру
<div class="good_title">Диски</div>
<div class="good_title">Сельскохозяйств нные запчасти</div>
<div class="good_title">Книги</div>

Как мне на JS или JQuery узнать максимальную высоту блока?
К примеру $(".good_title").height(); возвращает высоту первого блока

B@rmaley.e><e 29.08.2011 19:58

Math.max.apply(Math, $(".good_title").map(function(){
  return $(this).height()
}).get());

frost18 29.08.2011 22:07

Спасибо добрый человек, сейчас попробую

frost18 29.08.2011 22:59

А как мне узнать максимальный размер только в первых четырех блоках, потом в следущих четырех и т.д ?

frost18 30.08.2011 01:41

Подскажите пожалуйста как выбрать конкретные блоки.
К примеру '.good_title:lt('+count+')' Выберет все до указанного. А как мне задать чтоб не с первого а с определенного до определенного?

melky 30.08.2011 11:15

по идее, такая конструкция должна работать

должен выделить со второго по пятый, не включая => дивы с номерами 3 и 4 внутри
Пример: не работает. хотя должно
<script src="http://yandex.st/jquery/1.6.2/jquery.min.js"></script>
<div>0</div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<script>
*!*
$('div*!*:gt(2):lt(5)*/!*').css("border","1px red solid");
*!*
</script>

ещё в jquery можно сделать так ( slice, как обычный массив )
<script src="http://yandex.st/jquery/1.6.2/jquery.min.js"></script>
<div>0</div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<script>
*!*
$('div')*!*.slice(3,5)*/!*.css("border","1px red solid");
*/!*
</script>


var res = [],    // массив результатов
      a;           // кэш коллекции

// кэшируем коллекцию и обходим её
(a=$("div")).each(function(i) { 

    // остаток от деления на 4 может быть нулевым и у нуля.
    if (i % 4 === 0)
        // обрезаем коллекцию от текущей до "текущей+4", 
        // высчитываем массив высот 
        // и помещаем в результат максимальную
        res.push(Math.max.apply(Math, a.slice( i, i+4 ).map(function(){
            return $(this).height();
        }).get()));

});

// всё
alert(res);


создадим 10 div ( в итоге это 2 высоты (по 4 эл ) плюс 2 элемента по отдельности .. то бишь всего должно быть три высоты в результате)
Пример: живой пример
<script src="http://yandex.st/jquery/1.6.2/jquery.min.js"></script>
<body>

</body>
<script>
// создаем одинаковые div
for (var i = 0; i < 10; i++) $("<div>" + i + "</div>").appendTo(document.body);

var res = [], a;

(a=$("div")).each(function(i) {

    if (i % 4 === 0)
        res.push(Math.max.apply(Math, a.slice( i, i+4 ).map(function(){
            return $(this).height();
        }).get()));
    
});


alert(res);
</script>


единственный минус этого способа - это два цикла. но первый лёгкий (проверяем i ), а второй обходит 4 элемента.

B@rmaley.e><e 30.08.2011 11:43

Цитата:

Пример: не работает. хотя должно
<script src="http://yandex.st/jquery/1.6.2/jquery.min.js"></script>
<div>0</div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<script>
$('div:gt(2):lt(5)').css("border","1px red solid");
</script>

melky 30.08.2011 12:48

B@rmaley.e><e

к
<div>0</div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>

применяем
$('div:gt(2):lt(5)').css("border","1px red solid");


получаем

<div>0</div>
<div>1</div>
<div>2</div>
<div style="border : 1px red solid">3</div>
<div style="border : 1px red solid">4</div>
<div style="border : 1px red solid">5</div>
<div style="border : 1px red solid">6</div>

B@rmaley.e><e 30.08.2011 12:50

Так оно и работает.

guestalex 21.10.2013 19:38

ребята, нужно узнать максимальную высоту картинки в TD тэге, таких вообще 3 TD с картинками, просто сами картинки разные по высоте, мне нужно узнать высоту максимально высокой картинки, загнать это число в переменную и на все TD сделать эту высоту...

пробовал equalHeight - в хроме не помогает, постоянно высоту TD показывает 0px... решил пойти другим путём, помогите...

везде работает нормально equalHeight, кроме хрома.. задолбался уже просто...
при проверке через alert вывести высоту картинки, в хроме всегда показывает 0... бред какой-то...

а, ребята, всё, решил проблему...

чтобы в хроме нормально отображалось в equalHeight.js использовал $(window).load, вместо $(document).ready - не русские совет дали...


Часовой пояс GMT +3, время: 06:32.