Решил создать тему, так как считаю, что это будет кому-нибудь полезно.
Сегодня решив сделать подгрузку товаров, увидел вышеупомянутую тему, сделав все по инструкции, конечно все получилось, но начались косяки, а именно: при включенном 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 фикс высоты"
Вроде все, должно работать.
Надеюсь я сэкономил кому-нибудь время, которое потратил сам.
Answered
