'rel'매개 변수를 Photoset-grid로 변경하는 방법은 무엇입니까?

나는 tumblr 블로그에 포토 셋 - 격자 : http://stylehatch.github.io/photoset-grid/을 사용합니다. 코드 :'rel'매개 변수를 Photoset-grid로 변경하는 방법은 무엇입니까?

<body> 
<div class="wrapper"> 
{block:IndexPage} 
    <ul id="posts"> 
     {block:Posts} 
      <li> 
       {block:Photoset} 
        <div class="photoset-grid" data-layout="{PhotosetLayout}" data-id="photoset{PostID}" style="visibility: hidden;"> 
         {block:Photos} 
          <img src="{PhotoURL-500}" 
          {block:HighRes}data-highres="{PhotoURL-HighRes}"{/block:HighRes} 
          {block:Caption}alt="{Caption}"{/block:Caption} /> 
         {/block:Photos} 
        </div> 
        {block:Caption} 
         {Caption} 
        {/block:Caption} 
       {/block:Photoset} 
      </li> 
     {/block:Posts} 
    </ul> 
{/block:IndexPage} 
</div> 

<script type="text/javascript"> 
$('.photoset-grid').photosetGrid({ 
    highresLinks: true, 
    rel: $('.photoset-grid').attr("data-id"), 
    gutter: '10px', 

    onComplete: function(){ 
    $('.photoset-grid').attr('style', ''); 
    $('.photoset-grid a').colorbox({ 
     photo: true, 
     scalePhotos: true, 
     maxHeight:'90%', 
     maxWidth:'90%' 
    }); 
    } 
}); 
</script> 
</body>

문제 : 사진의 다른 세트에 대한 'photosetGrid'에서 '확인해'매개 변수를 변경하지 않습니다.

첫 번째 게시물 :

<div class="photoset-grid" data-layout="122" data-id="photoset58370010471" style="" data-width="600"> 
<div class="photoset-row cols-1" style="margin-bottom: 10px; clear: left; display: block; overflow: hidden; height: 390px;"> 
<a href = "bla0.jpg" class = "photoset-cell highres-link cboxElement" rel = "photoset58370010471" style = "float: left; display: block; line-height: 0; box-sizing: border-box; width: 100%; ">

두 번째 포스트 :이 웹 사이트에 보이는 방법

<div class="photoset-grid" data-layout="122" data-id="photoset58327675703" style="" data-width="600"> 
<div class="photoset-row cols-1" style="margin-bottom: 10px; clear: left; display: block; overflow: hidden; height: 468px;"> 
<a href = "bla1.jpg" class = "photoset-cell highres-link cboxElement" rel = "photoset58370010471" style = "float: left; display: block; line-height: 0; box-sizing: border-box; width: 100%;">

변화의 매개 변수의 데이터-ID '및 매개 변수' rel '은 동일하게 유지됩니다.

'data-id'를 사용하여 'rel'매개 변수를 다양하게 만드는 방법은 무엇입니까?

즉, 다른 게시물의 사진 세트에는 식별자가 다르며 컬렉션이 아닙니다.

감사합니다.

+++ Desicion +++

<script type="text/javascript"> 
     $.each($('.photoset-grid'), function() { 
      $(this).photosetGrid({ 
       highresLinks: true, 
       rel: $(this).attr('data-id'), 
       gutter: '10px', 

       onComplete: function(){ 
       $('.photoset-grid').attr('style', ''); 
       $('.photoset-grid a').colorbox({ 
        photo: true 
       }); 
       } 
      }); 
     }); 
    </script>

출처

2013-08-17 0x131313

'매개 변수 rel'을 말할 때, 첫 번째 Post 예제에서 lightbox config 또는 anchor attribute 'rel'에서 변수 'rel'에 대해 이야기하고 있습니까? – mikedidthis

이 'rel'에 대해 말합니다 : " 0x131313

문제는 'rel' 모든 사진이 포함되어 있습니다. – 0x131313

이 문제는 당신이 선택한 여러 요소에 동시에 photosetGrid() 함수를 호출하고 있다는 사실에서오고있다. jQuery의 each() 함수를 사용하여 요소를 반복해야한다.

출처

2013-08-19 21:12:20

큰 감사합니다! 나는 각각을 쓰고() 어떻게 일을하는 법을 수정한다! – 0x131313

올바른 방향을 추가하십시오! – 0x131313

좋은 장소. 나는 ** 플러그인이 하나 이상의 인스턴스를 처리 할 것이라고 추정했다. – mikedidthis

'rel'매개 변수를 Photoset-grid로 변경하는 방법은 무엇입니까?

답변

관련 문제