6

私は画像付きのモーダルダイアログを表示するためにjQUerythickboxを見てきました。それは素晴らしいことです。しかし今、私はコンテンツを開くためのリンクとともに、同様の方法でiFrameを含むコンテンツの非表示のdivを表示する必要があります。だから私はこのようなものを持っているでしょう。

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

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

そしてそれをダイアログに表示する必要があります。出来ますか？

4

4 に答える 4

7

Thickboxはそれをサポートしています。http://jquery.com/demo/thickbox/でインラインコンテンツのデモを参照してください

于 2008-10-16T23:31:34.387 に答える
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();
}
于 2008-10-16T23:36:22.053 に答える
0

以下は私の修正の詳細です。うまくいけば、これらの変更をJQueryプラグインに統合できます。jquery1.4.2とjqueryUI1.8.2を使用しています。

jquery-frameddialog.jsで、幅と高さを100％（pxではなく）に変更してから、jQueryUI1.7のFIXを次のように変更しました。

wrap.bind('dragstart', function() { overlay.show(); })
  .bind('dragstop', function() { overlay.hide(); })
  .bind('resizestart', function() { overlay.show(); })
  .bind('resizestop', function() { overlay.hide(); });
于 2010-07-22T14:39:10.173 に答える
0

基本ビューとして iFrame を使用する jQueryUI のダイアログの拡張機能があります...いくつかのデフォルトを調整します ([OK/キャンセル] ボタンの追加など) が、必要なものの適切なベースになるはずです。これは古い質問であることは知っていますが、人々にそれを認識してもらいたいだけです。

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

于 2010-06-16T20:30:38.797 に答える