Всемогущий (13 Апрель 2013 - 17:49) писал:
Сделал, получается не АЙС!
Чтобы товары отображались ровно, выравнивались по верхнему краю в строке, нужно сделать следующее:
1) в файле style.css прописать
.containers .items, .containers2 .items {display: inline-block; float: none !important; *display: inline; vertical-align: top; width:170px !important;}
.containers .items figure, .containers2 .items figure, .containers .items>div, .containers2 .items>div {width:170px !important;}
2) в файле main.js найти следующие части кода (выделены красным)
//Подгрузка товаров в каталоге
$(function(){
var $container = $('.containers');
// Минимальное расстояние между товарами в каталоге
$container.imagesLoaded(function(){
$container.masonry({
itemSelector: '.items',
// указываем класс элемента являющегося блоком в нашей сетке
singleMode: false,
// true - если у вас все блоки одинаковой ширины
isResizable: true,
// перестраивает блоки при изменении размеров окна
isAnimated: true,
// Ужиматься до минимальной ширины, чтобы можно было центрировать блок
isFitWidth: true,
// анимируем перестроение блоков
animationOptions: {
queue: false,
duration: 500
}
// опции анимации - очередь и продолжительность анимации
});
});
var lastPage = 1;
var pagesNum = $("div.pagination").find("a:last").text(); // Количество страниц
$container.infinitescroll({
navSelector : '.pagination', // класс элемента постраничной навигации
nextSelector : '.pagination a', // класс элемента постраничной навигации, ссылка на следующую страницу
itemSelector : '.items', // класс элементов, которые будем извлекать
loading: {
msgText: 'Пожалуйста подождите...',
finishedMsg: 'Больше нет товаров.',
img: '/web/upload/assets/images/136/135380/loader.gif'
}
},
function( newElements ) {
// скрываем новые элементы, пока они не загрузятся
var $newElems = $( newElements ).css({ opacity: 0 });
// обеспечиваем загрузку изображением перед добавление из на страницу
$newElems.imagesLoaded(function(){
// показываем готовые элементы
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
});
lastPage++;
// если это последняя страница
if(lastPage >= pagesNum){
$container.infinitescroll('pause');
}
}
);
});
$(function(){
var $container2 = $('.containers2');
// Минимальное расстояние между товарами в каталоге
$container2.imagesLoaded(function(){
$container2.masonry({
itemSelector: '.items',
// указываем класс элемента являющегося блоком в нашей сетке
singleMode: false,
// true - если у вас все блоки одинаковой ширины
isResizable: true,
// перестраивает блоки при изменении размеров окна
isAnimated: true,
// Ужиматься до минимальной ширины, чтобы можно было центрировать блок
isFitWidth: true,
// анимируем перестроение блоков
animationOptions: {
queue: false,
duration: 500
}
// опции анимации - очередь и продолжительность анимации
});
});
});
и удалить их.