jQuery Thickbox 또는 유사한 iframe을 보여주고 있습니까?

Question

나는보고 있었다 jQuery Thickbox 이미지가있는 모달 대화 상자를 보여주기 위해서는 훌륭합니다. 그러나 이제는 컨텐츠를 열 수있는 링크와 함께 비슷한 방식으로 iframe을 포함하는 숨겨진 컨텐츠를 표시해야합니다. 그래서 나는 다음과 같은 것을 가질 것입니다.

<a href="">Open window in Modal Dialog</a>

<div id="myContent">
    <h1>Look at me!</h1>
    <iframe src="http://www.google.com" />
</div>

대화 상자에서 보여줄 필요가 있습니다. 가능합니까?

Answer 1

Thickbox는 그것을 지원합니다. 인라인 콘텐츠 데모를 참조하십시오 http://jquery.com/demo/thickbox/

Answer 2

나는 jqmodal을 사용하고 잘 작동하며 가볍습니다. 다음은 iframe과 함께 일하게하는 방법입니다.

이것은 HTML입니다

<div class="jqmWindow" id="modalDialog">  
    <iframe frameborder="0" id="jqmContent" src=""> 
    </iframe>  
</div>

그리고 호출 코드

function showModal(url, height, width)
{    
    var dialog = $('#modalDialog')
        .jqm({ 
            onShow: function(h) {
                var $modal = $(h.w);                
                var $modalContent = $("iframe", $modal); 
                $modalContent.html('').attr('src', url); 
                if (height > 0) $modal.height(height);    
                if (width > 0) $modal.width(width);                
                h.w.show();          
            } 
         }).jqmShow();        
}

function closeModal(postback)
{
    $('#modalDialog').jqmHide();
}

Answer 3

기본보기로 iframe을 사용하는 jQueryUi의 대화 상자가 확장되어 있습니다. 몇 가지 기본값을 조정하지만 (OK/CANCEL 버튼 추가와 같은), 필요한 것에 대한 적절한 기반이어야합니다. 나는 이것이 오래된 질문이라는 것을 알고 있지만 사람들이 그것을 인식하게 만들고 싶어합니다.

http://plugins.jquery.com/project/jquery-framedialog

Answer 4

다음은 내 수정의 세부 사항입니다. 이러한 변경 사항을 jQuery 플러그인에 통합 할 수 있기를 바랍니다. jQuery 1.4.2와 jQuery UI 1.8.2를 사용하고 있습니다.

jQuery-FramedDialog.js에서는 너비와 높이를 100% (PX가 아님)로 변경 한 다음 jQueryUi 1.7의 수정 사항을 다음 대신 다음으로 변경했습니다.

wrap.bind('dragstart', function() { overlay.show(); })
  .bind('dragstop', function() { overlay.hide(); })
  .bind('resizestart', function() { overlay.show(); })
  .bind('resizestop', function() { overlay.hide(); });