Как работать с динамическим контейнером в изотопе?

Question

В контексте повторного использования контейнера изотопов на разных частях веб-приложения мне необходимо изменить размер контейнера. Однако после добавления и удаления класса CSS для небольшого макета контейнер больше не занимает больше места.

Смотрите JSFiddle: http://jsfiddle.net/mulderp/ptLzx/5/

$container.addClass('small'); 

Это изменяет размер контейнера, как ожидалось.

$container.removeClass('small'); 
$container.isotope('shuffle'); 

Ожидается, что возвращение оригинального контейнера. Это не работает.

Любые подсказки, как настроить работу?

Answer 1

Похоже, что проблема с синхронизацией, это, как правило, происходит с изотопом.

Если поставить SetTimeout() из 1000ms вокруг метода в случайном порядке он работает - поэтому подтверждающим вопрос ...

$('#large').click(function(){ 
    $container.removeClass('small'); 
    var timer = setTimeout(function(){ 
     $container.isotope('shuffle');  
    },1000); 
}); 

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

Я бы также рекомендовал использовать $container.isotope('reLayout') по телефону $container.isotope('shuffle'), если вам не нужно перетасовывать элементы, этот метод был создан для выполнения именно этого.