페이지 당 여러 개의 벽돌 그리드가 필요합니다. WordPress 루프로 코드를 생성하므로 모든 div 컨테이너의 클래스 이름이 같습니다.페이지 당 동일한 클래스 이름으로 여러 번 벽돌을 사용할 수 있습니까?
같은 이름의 모든 div 컨테이너에서 Masonry를 호출하는 방법이 있습니까? 당신을 위해
http://codepen.io/anon/pen/OXBrPb
감사 : 여기에 HTML
<!--Masonry 1-->
<div class="print-slider">
<div class="print-slider-sizer"></div>
<div class="gutter-sizer"></div>
<div class="print-slider-item"></div>
<div class="print-slider-item"></div>
<div class="print-slider-item"></div>
<div class="print-slider-item"></div>
</div>
<!--Masonry 2-->
<div class="print-slider">
<div class="print-slider-sizer"></div>
<div class="gutter-sizer"></div>
<div class="print-slider-item"></div>
<div class="print-slider-item"></div>
<div class="print-slider-item"></div>
<div class="print-slider-item"></div>
</div>
JS
var grid = document.querySelector('.print-slider');
var msnry;
imagesLoaded(grid, function() {
// init Isotope after all images have loaded
msnry = new Masonry(grid, {
itemSelector: '.print-slider-item',
columnWidth: '.print-slider-sizer',
gutter: '.gutter-sizer',
percentPosition: true,
});
});
이 문제에 대한 코드 펜입니다 r 도움!
고맙습니다! 그건 완벽하게 작동합니다 :) –
나는 그것이 도움이 된 것을 기쁘게 생각합니다 :) – trajchevska