Masonry — криво работает?

Question

[Alexander9229]

Почему masonry загружается через раз галерею?

Один раз может загрузить всё отлично! А второй раз всё криво ->

Скрипт:

<script>
		$(document).ready(function () {
			$( '.grid' ).masonry( {
				// options
				itemSelector: '.grid-item',
				horizontalOrder: true,
			} );
		});
	</script>

Почему так происходит?

Comments

[Антон Литвиненко]

Погуглите вместе masonrу и imagesloaded

[Alexander9229]

Антон Литвиненко, понял косяк!
Большое спасибо! Теперь всё работает!!!

[Вадим]

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

Answer 1

[Alexander9229]

Так как я использовал Masonry в проекте вместе в WordPress, мне подробно помогла разобраться эта статья - Masonry

Answer 2

[Антон Литвиненко]

Нужно подключить скрипт
https://imagesloaded.desandro.com/
и прогонять изотоп или масонри через него. при аякс подгрузке тоже

$('.portfolio-wrap').imagesLoaded (function() {
	var $grid = $('.portfolio-wrap');

	$grid.isotope({
		itemSelector: '.portfolio-item',
		layoutMode: 'fitRows',
		percentPosition: true
	});

});