hs.htmlExpand 내가</p> <p>I 열린 팝업의 이미지에 사용자가 클릭이 내용이 iframe에 URL을 변경할 때, 좋아 (/ 개폐 아니지만, 크로스 페이드) 할

Question

을 클릭 hs.transitions = [ 'expand', 'crossfade']가있는 갤러리가 있습니다.

다음 공사는 이전 팝업 창을 닫고 새 창을 열고 (슬라이드 쇼를 중단 함) 사용자가 다음 이미지를 클릭하는 것과 같은 효과 (크로스 페이드)를 원합니다.

hs.allowMultipleInstances = false; 
hs.Expander.prototype.onImageClick = function() 
{ 
    return hs.htmlExpand(null, { objectType: 'iframe', src: 'url' }); 
}; 

만드는 방법은?

샘플 - http://jsfiddle.net/xCnfE/4/

Answer 1

는 HTML 팝업 갤러리의 일부가 아닌 경우는 HTML 팝업에 이미지에서 크로스 페이드 수 없습니다. 대신 jQuery로 이미지를 덮는 일반 iframe을 만들고 이미지를 클릭 할 때만이 iframe을 표시 할 수 있습니다 (onImageClick).

<a href="large-image.jpg" class="highslide" onclick="return hs.expand(this, galleryOptions, {url: 'http://highslide.com/'})"> 
    <img src="thumbnail.jpg" alt="Caption Text" /> 
</a> 

: http://jsfiddle.net/roadrash/B7sDG/

hs.Expander.prototype.onImageClick = function (sender) { 
    $('<iframe src="'+this.custom.url+'" frameborder="0"></iframe>').css({ 
     position: 'absolute', 
     top: '0', 
     height: '100%', 
     width: '100%', 
     background: '#fff', 
     zIndex: 20 
    }).appendTo(sender.wrapper); 
    return false; 
}; 

url는 onclick에 hs.custom를 사용하여 iframe을 src에 전달됩니다 참조하십시오