Проблема роста в Chrome с изотопом jQuery в адаптивной планировке с начальной загрузкой 3 ⇐ Jquery

[Anonymous]

Я использую Isotope Plugin, чтобы фильтровать свой список продуктов. Я также использую Bootstrap 3 для общего макета, страница должна быть отзывчивой, поэтому ширина столбца основана на процентах. Я хочу миниатюрную высоту изображения и равную ширину, простую сетку. Сначала я попробовал с режимом макета «Fitrows», но у меня была проблема с неправильными числами столбцов, показывающих (во всех браузерах), и я обнаружил дополнительное поведение макета «неряшливая кладка», опубликованная Cubica по адресу https://github.com/cubica/isotope-sloppy-mononry-эта проблема с шириной колонки при отзывчивом гибде. Чтобы решить одинаковую высоту, я сделал простой JS, чтобы установить все высоты для адаптации к самым высоким элементам. /> (un) смешное, что это не происходит каждый раз. Кроме того, когда я изменяю размер окна Chrome, макет становится правильно ... < /p>

Я читаю, что изотоп V2 (теперь бета) лучше обрабатывает отзывчивые макеты, но я не мог заставить его работать лучше. Теперь я пробовал много разных трюков, но я не могу получить это, как хочу. Текущий код работает во всех основных браузерах, кроме Chrome ... Help Pryated!


[img]" class="img-responsive" />

< /code>

JS Функция для достижения равных высот: < /p>

function resizeBoxes()
{
var h = 0;
$('div.view').each(function()
{
var b = $(this);
if (h < b.height()) h = b.height();
});
$('div.view').height(h);
}
< /code>

и изотопная функция init: < /p>

var $container = $('#listing');
function initIsotope()
{
$container.isotope({
layoutMode: 'sloppyMasonry',
});
}

$(window).resize(function() {
resizeBoxes();
initIsotope();
});
$(document).ready(function() {
resizeBoxes();
initIsotope();
});


Подробнее здесь: https://stackoverflow.com/questions/211 ... ootstrap-3