나는이 게시물 How to create a direct link to any fancybox box을 살펴보고 구현했습니다. 그러나 누군가가 이미지를 클릭 할 때마다 URL이 바뀌지 않는 것으로 나타났습니다. 그래서, 기본적으로 모든 스크립트는 제가 사람들에게 이미지의 링크를 제공하는 것입니다. 사람들이 자신을 위해 이미지 링크를 잡아 공유하고 싶다면 어떻게해야할까요? 사람들이 사이트를 탐색 할 때 주소 표시 줄에 다른 이미지 URL을 표시 할 수 있습니까?"어떤 fancybox에 대한 직접 링크"이지만 주소창에 URL이 있습니다
답변
만약 내가 제대로 이해 :
- 방문자가 이미지를 클릭, 이미지가 fancybox에 나타납니다.
- 방문자가 page.html # image01로 이동하면 fancybox에 image01이 이미 표시된 상태로 페이지가로드됩니다.
- 방문자가 image02를 클릭하면 url이 page.html # image02로 업데이트되기를 원합니다.
그런 경우 이미지를 클릭 할 때 url 해시 조각을 설정할 수 있습니다.
location.hash = "image02";
당신의 공급 예를 사용 : 나는 그렉의 코드를 사용
var thisHash = window.location.hash;
$(document).ready(function() {
$('.thumbs').fancybox({
prevEffect: 'fade',
nextEffect: 'fade',
closeBtn: true,
arrows: true,
nextClick: true,
padding: 15,
helpers: {
thumbs: {
width: 80,
height: 80
}
},
beforeShow: function() {
var id = this.element.attr("id")
if (id) {
window.location.hash = id;
}
},
beforeClose: function() {
window.location.hash = "";
}
});
if (thisHash) {
$(thisHash).trigger('click');
}
});
안녕하세요. 처음에는 "."을 삽입하면 Dreamweaver에서 오류가 발생하고 실제로 충돌을 일으킨다 고 알려주므로 Dreamweaver가 먼저 작동하지 않습니다. 이미지를 열면 이미지 자체로 리디렉션되기 때문입니다. 두 번째로 코드가 내 페이지 안에있는 모든 이미지 용이므로 작동하지 않을 것입니다. 곧이 예제를 예제 페이지로 업데이트하겠습니다. – coldpumpkin
안녕하세요. 예 (location.hash 없음)에 대한 링크는 다음과 같습니다. http://josemelo.net/example/index.html 여기에 location.hash가있는 예 2의 링크가 있습니다. http :// /josemelo.net/example/index2.html – coldpumpkin
@coldpumpkin - location.hash를 fancybox의 options 객체에 대한 속성으로 추가했습니다. 그건 맞지 않아. 나의 예'location.hash = "image02";는 진술이다. 이벤트 처리기에서 호출해야합니다. – Greg
을하지만 (그렉의 방법은 나를 위해 작동하지 않는 때문에 다른 방법으로 ID를 참조) 내가 대신이 옵션을 사용 :
onStart: function(selectedArray, selectedIndex, selectedOpts) {
var id = $(selectedArray[ selectedIndex ]).attr('id');
if (id) {
window.location.hash = id;
}
},
onClosed: function() {
window.location.hash = "";
}
beforeShow: function() { var id = $(this.element).attr("href"); if (id) { window.location.hash = id; } }, afterClose: function() { history.pushState("", document.title, window.location.pathname + window.location.search); },
Welcome to StackOverflow! 게시물 당 하나의 질문/주제로 제한하십시오. "Ask Question"을 눌러 새 질문을 시작하십시오. 이렇게하면 사람들이 귀하의 질문을 검토하고 대답하기가 더 쉬워집니다. 감사! – Greg
죄송합니다. – coldpumpkin