단일 요소에서 fancybox를 사용하는 경우 어떻게 그룹화 할 수 있습니까?

Question

나는 각 요소를 반복해서 바꿔서 href 값을 바꿀 수 있지만,이 경우 이미지를 그룹화 할 수 없습니다. rel이 작동하지 않습니다.

[].forEach.call(gallery_images_thumbnails_list.querySelectorAll('.category'), function(element){ 
    $(element).fancybox({ 
     href: element.getAttribute('data-image'), 
     rel: "fancybox" 
    }); 
}); 

어떻게 이런 식으로 그룹화 할 수 있습니까? 그렇지 않다면 .category에 fancybox를 가질 수 있으며 동시에 각 요소에 대해 href을 설정합니까? $(element) 만약

Answer 1

가 앵커 (<a> 태그)이며, 대신

[].forEach.call(gallery_images_thumbnails_list.querySelectorAll('.category'), function (element) { 
    $(element).attr("rel", "fancybox").fancybox({ 
     href: element.getAttribute('data-image') 
    }); 
}); 

당신이

$(element).fancybox({ 
    //API options 
}); 

을 수행 할 때, 때문에 ... 플러그인이 valid API 옵션을 기대하고 이것을 시도 rel은 그 중 하나가 아닙니다. (난 당신이 이 축소판을 쿼리하는보기 때문에) $(element)는 <img> 태그 인 경우에, 당신은 오히려 시도 반면에

---

,

[].forEach.call(gallery_images_thumbnails_list.querySelectorAll('.category'), function (element) { 
    $(element).wrap($("<a />", { 
     href: element.getAttribute('data-image'), 
     rel: "fancybox", 
     "class": "fancybox" 
    })); 
}); 

클래스가 될 필요공지 사항 따옴표 붙어 있기 때문에 예약 됨 자바 스크립트 단어

위의 코드는 여전히

$(".fancybox").fancybox({ 
    // API options 
});