Функция изменения размера окна jQuery вызывает только вызовы

Question

В основном у меня есть неупорядоченный список с изображениями. Я использую jquery, чтобы убедиться, что все теги li занимают одинаковое количество вертикального пространства. Тем не менее, мой сайт является текучим, и я хочу, чтобы мой jquery изменял размер тегов li при загрузке страницы, а также при изменении размера окна браузера. Я использовал следующее решение, которое, я считаю, должно работать и после прочтения других потоков, которые с успехом делают подобные вещи, я не понимаю, почему мой код не стреляет в изменение размера окна.

Вот сайт, где вы можете увидеть, что теги Ли не изменять размеры с страницы (если вы не обновить): http://www.webedify.com/sse/type.html

Мой HTML:

<ul class="img-results"> 
    <li><a href="#"><img src="img.jpg" alt=""></a></li> 
    <li><a href="#"><img src="img.jpg" alt=""></a></li> 
    <li><a href="#"><img src="img.jpg" alt=""></a></li> 
    <li><a href="#"><img src="img.jpg" alt=""></a></li> 
</ul> 

Мой JQuery:

var imght = function() { 
     var maxHeight = -1; 
     $('ul.img-results li').each(function() { 
      maxHeight = maxHeight > $(this).height() ? maxHeight : $(this).height(); 
     }); 
     $('ul.img-results li').each(function() { 
      $(this).height(maxHeight); 
     }); 
    }; 

    $(document).ready(imght); 
    $(window).resize(imght); 

Что мне не хватает? Я чувствую, что это что-то маленькое и, возможно, очевидно, я просто не вижу его. Спасибо за любую помощь.

Answer 1

Проблема заключается в том, что после указания высоты изменение размера браузера больше не будет изменять высоту. Высота будет соответствовать указанной вами высоте. Удалите свою прежнюю высоту, прежде чем пытаться найти, какой должна быть новая высота.

var imght = function() { 
     var maxHeight = -1; 
     var uls=$('ul.img-results li'); 
     uls.css({'height':'auto'}); 
     uls.each(function() { 
      maxHeight = maxHeight > $(this).height() ? maxHeight : $(this).height(); 
     }); 
     uls.each(function() { 
      $(this).height(maxHeight); 
     }); 
    };