Эффект динамического изменения размера в компоненте Metafizzy Packery

Question

Я ищу компонент Пакет JavaScript. Я хочу переключить текущую реализацию с GridStack на Packery. Одна вещь, которая останавливает меня сейчас, - это отсутствие эффекта динамического изменения размера компонентов (панелей) в Packery. Сейчас я не могу найти эту функцию в демоверсии или документации.

Есть ли способ реализовать / включить эту функцию в Packery?

Answer 1

Это, безусловно, можно сделать. Используйте настройку "Адаптивные макеты" в качестве модели: https://packery.metafizzy.co/layout.html

Важно также, что вы должны использовать собственные файлы Metafizzy imagesLoaded js для загрузки javascript после полной загрузки изображений: https://imagesloaded.desandro.com/

Полный вызов javascript (пакет внутри imagesLoaded) должен выглядеть следующим образом:

<script type='text/javascript'>
    $('.grid').imagesLoaded( function(){
        $('.grid').packery({
            itemSelector:'.grid-item',
            percentPosition:true, // *critical for responsive layout*
            // your own further options
        });
    });
</script>

Если у вас по-прежнему возникают проблемы, попробуйте отменить вызов js так, чтобы imagesLoaded вызывался после каждой загрузки изображения, как рекомендуется на веб-странице Packery: https://packery.metafizzy.co/layout.html

Удачи!