Решил создать тему, так как считаю, что это будет кому-нибудь полезно.
Сегодня решив сделать подгрузку товаров, увидел вышеупомянутую тему, сделав все по инструкции, конечно все получилось, но начались косяки, а именно: при включенном JS фиксе высоты колонок подгружаемые товары не были выровнены по высоте, никакая магия мне не помогла.
Именно поэтому в интернете нашелся другой скрипт, который выравнивает высоту колонок, и с которым не возникло проблем при подгрузке товаров.
Теперь обо всем по порядку.
1. Скрипт, который будет выравнивать высоту колонок:
<script type="text/javascript"> jQuery.fn.equalHeights = function(minHeight, maxHeight) { tallest = (minHeight) ? minHeight : 0; this.each(function() { if(jQuery(this).height() > tallest) { tallest = jQuery(this).height(); } }); if((maxHeight) && tallest > maxHeight) tallest = maxHeight; return this.each(function() { jQuery(this).height(tallest).css("overflow","auto"); }); } </script>Его я подключил head (на случай, если буду пользоваться им не только в zoo).
2. Вызываем скрипт выравнивания высоты
<script type="text/javascript"> jQuery(document).ready(function() { jQuery(".jbzoo .items .column").equalHeights(); jQuery(".jbzoo .subcategories .column").equalHeights(); jQuery(".jbzoo .related-items .column").equalHeights(); }); </script>3 строчки с классами означают, какие блоки будут выравниваться. Первый - это товары в категории, второе - сами блоки субкатегорий, третье - похожие товары.
3. Скрипт, ссылку на который дал Sliappy в предыдущей теме, - ТЫК. Скрипт подключается просто:
<script type="text/javascript" src="jquery-ias.min.js"></script> <link rel="stylesheet" type="text/css" href="css/jquery.ias.css" />4. Вызываем скрипт подгрузки
<script> jQuery.ias({ container : ".items", item : ".width25", pagination : ".pagination", next : "a.next", loader : "<img src='images/loader.gif'/>", triggerPageThreshold : 1, trigger : "Показать больше товаров", onRenderComplete: function(items) { jQuery(".jbzoo .items .column").equalHeights(); }, history : false }); </script>Здесь самое главное - это onRenderComplete, где мы вызываем скрипт выравнивания высоты.
- pagination - идентификатор пагинации, который исчезнет при подгрузке
- item - идентификатор подгружаемых товаров (у меня он .width25)
- history отвечает за сохранение истории подгрузки (при прокрутке к адресу будет прибавляться якорь #/page/)[/size]
- [/size]triggerPageThreshold отвечает за номер страницы, с которой товары будут подгружаться при нажатии на кнопку.
- trigger - надпись на кнопке, которая отвечает за дальнейшую подгрузку
5. Убираем галочку в настройках каталога "JS фикс высоты"
Вроде все, должно работать.
Надеюсь я сэкономил кому-нибудь время, которое потратил сам.