jquery masonry with wordpress에 항목을 추가 할 수 없습니다.

Question

여기에 벽돌에 관한 많은 질문이 있습니다.하지만 확실한 해결 방법이 무엇인지에 대한 답을 찾지 못했습니다. 나는 append 메소드를 작동 시키려고 노력하고 있습니다 : http://masonry.desandro.com/demos/adding-items.html, 그러나 그 Append와 Prepend 버튼은 어디에서 왔습니까? 코드는이 버튼을 스크립트와 연결하는 방법을 언급하지 않는 것 같습니다. 나는 wordpress 게시물의 다음 세트를 추가하기 위해 더 많은 버튼을 추가하고 싶습니다. 어디서나 솔루션을 찾을 수없는 것 같습니다. 누군가가 올바른 방향으로 나를 가리킬 수 있다면, 그것은 많이 감사 할 것입니다. 내 코드는 다음과 같습니다.

jQuery(document).ready(function($){ 

var $container = $('#linky'); 
var $boxes = $('<div class="boxy"/><div class="boxy"/><div class="boxy"/>'); 

$container.append($boxes).masonry('appended', $boxes); 
$container.imagesLoaded(function(){ 
    $container.masonry({ 
    itemSelector : '.boxy', 
    isFitWidth: true, 
    singleMode: true, 
    isAnimated: false, 

    }); 
    }); 
}); 

Answer 1

해당 데모 페이지의 소스보기. 맨 아래쪽을 보면 버튼을 클릭 할 때 실행되는 코드 섹션이 있습니다. 그것들은 함수 호출을 트리거하는 것이다. $('#prepend').click(...

<script> 
    $(function(){ 

    var $container = $('#container'); 

    $container.masonry({ 
     itemSelector: '.box', 
     columnWidth: 100, 
     isAnimated: !Modernizr.csstransitions 
    }); 

    $('#prepend').click(function(){ 
     var $boxes = $(boxMaker.makeBoxes()); 
     $container.prepend($boxes).masonry('reload'); 
    }); 

    $('#append').click(function(){ 
     var $boxes = $(boxMaker.makeBoxes()); 
     $container.append($boxes).masonry('appended', $boxes); 
    }); 

    }); 
</script> 

은 ID "앞에 추가"를 가진 요소의 클릭에, 다음과 같은 기능을 실행하는 것을 말한다. 페이지에있는 단추를 보면이 부분의 기능과 일치하는 ID를 가진 단순한 단추 (ids 앞에 추가 및 추가)가 있습니다.

<button id="prepend">Prepend new items</button> 
<button id="append">Append new items</button>