动态调整JQuery模式对话框到IFrame内容的大小

时间:2014-04-24 09:02:37

标签: javascript jquery css iframe

我有一个内部iFrame的JQuery对话框,它使用php文档填充图像和一些信息。它工作正常,但是如果我单击其中一个图像转到完整尺寸图像并在iFrame中显示它,则对话框不会调整大小。

这就是iframe和对话框的创建方式,我已经删除了一些额外的代码,但这里重要的是:

$('<iframe id="frameProductos" width="100%" src="articulos_info.php?codigo_art='+val+'" name="frameProductos">').appendTo('body');

                  var dialog = $("#frameProductos");

                 dialog.dialog({
                      title: 'Revisión de producto',
                      resizable: false,
                      modal: true,
                      position: ['center',150],
                      overlay: {
                          opacity: 0.5,
                          background: "black"
                      },
                      open: function( event, ui ) {

                          $('#frameProductos').width('100%');
                      },
                     close: function( event, ui ) {
                         $(this).dialog('destroy').remove();
                     },
                      width: 500,
                      height: 500,
                      buttons: {
                          "Cerrar": function () {
                              $(this).dialog('destroy').remove();

                          }

                      }
                  });

如果内容的大小发生变化(单击图像时会出现全分辨率图像),我需要使用对话框和iFrame更改其大小。

1 个答案:

答案 0 :(得分:0)

重要提示:您必须在加载完成后更新iframe的大小

    $(document).ready(function () {
        //do somthing like this
        window.parent.resizeIframe();
    });
相关问题