동위 원소로 이미지를 표시하는 데 필요한 조언 more function

Question

다음과 같은 상황에서 도움이 필요합니다. 다음은 전체 예제 링크입니다. https://jsfiddle.net/7kpfqLr6/25/

설명해 드리겠습니다. 더 많은 버튼을로드하기 전에 이미지 수를으로 설정하려고합니다. 문제는 첫 번째 동위 원소 항목이 이고 텍스트 항목이이라는 것을 알 수 있습니다. 다른 모든 항목은 이미지입니다. 이제 이미지 수를 6으로 설정하면 6 개의 동위 원소 항목 (첫 번째 텍스트 항목 + 5 개 이미지)이 표시됩니다. 예, 그것은 논리적이며 이해합니다. 하지만 첫 번째 항목 이후에 6 개의 이미지를 표시하고 싶습니다. 그것을하는 방법? 당신의 도움을 의지 할 수 있습니까?

감사합니다.

이

var initShow = 7; 

다음 이후 초기로드 후 6으로 변경 :

$(document).ready(function() { 

    // init Isotope 
    var $container = $('.isotope-items-wrap').isotope({ 
    itemSelector: '.isotope-item', 
     transitionDuration: '0.5s', 
     masonry: { 
      columnWidth: '.grid-sizer' 
     } 
    }); 

    //**************************** 
    // Isotope Load more button 
    //**************************** 
    var initShow = 6; //number of images loaded on init & onclick load more button 
    var counter = initShow; //counter for load more button 
    var iso = $container.data('isotope'); // get Isotope instance 

    loadMore(initShow); //execute function onload 

    function loadMore(toShow) { 
    $container.find(".hidden").removeClass("hidden"); 

    var hiddenElems = iso.filteredItems.slice(toShow, iso.filteredItems.length).map(function(item) { 
     return item.element; 
    }); 
    $(hiddenElems).addClass('hidden'); 
    $container.isotope('layout'); 

    //when no more to load, hide show more button 
    if (hiddenElems.length == 0) { 
     $("#load-more").hide(); 
    } 
    else { 
     $("#load-more").show(); 
    }; 

    } 

    //append load more button 
    $container.after('<div class="margin-top-30 text-center"><button id="load-more" class="btn btn-primary margin-top-5"> Load More</button></div>'); 

    //when load more button clicked 
    $("#load-more").click(function() { 
    if ($('#filters').data('clicked')) { 
     //when filter button clicked, set initial value for counter 
     counter = initShow; 
     j$('#filters').data('clicked', false); 
    } else { 
     counter = counter; 
    }; 

    counter = counter + initShow; 

    loadMore(counter); 
    }); 

}); 

Answer 1

당신의 가치를 선언 할 수 있습니다.

$("#load-more").click(function() { 
    if ($('#filters').data('clicked')) { 
     //when filter button clicked, set initial value for counter 
     counter = initShow; 
     j$('#filters').data('clicked', false); 
    } else { 
     counter = counter; 
    }; 
    initShow = 6; 
    counter = counter + initShow; 

    loadMore(counter); 
    }); 

초기 부하가 표시됩니다 6 images 추가 6 imagesbutton 당신 click 부하가 더있는 경우.

도움이 되었기를 바랍니다.