Affichage jquery ui boîte de dialogue modale en pleine fenêtre

Je veux afficher une boîte de dialogue modale qui contient plusieurs éléments, y compris un iframe. Je veux cette boîte de dialogue pour occuper environ 90% de la largeur et de la hauteur de la fenêtre. Le balisage est semblable à la suivante:

<div id="dialog">
    <div>Header information</div>
    <iframe></iframe>
</div>

Comment puis-je y parvenir? Lorsque j'utilise le jquery ui dialog, même quand je spécifier une largeur et une hauteur via la boîte de dialogue options ou une classe, ils sont remplacés par des styles en ligne que jquery ui attribue aux éléments.

OriginalL'auteur DCNYAM | 2011-10-12

  1. 5

    Je l'ai accompli en déterminant les dimensions de la fenêtre, alors la configuration de la boîte de dialogue de la largeur et de la hauteur de l'iframe en conséquence. Le code suivant peut être pas le plus beau, mais il fonctionne et peut facilement être modifié pour faire de la largeur et de la hauteur d'un pourcentage inférieur à la fenêtre.

    var dlg = $("#dialog"); //Get the dialog container.
//Get the window dimensions.
var width = $(window).width();
var height = $(window).height();

//Provide some space between the window edges.
width = width - 50;
height = height - 150; //iframe height will need to be even less to account for space taken up by dialog title bar, buttons, etc.

//Set the iframe height.
$(dlg.children("iframe").get(0)).css("height", height + "px");

dlg.dialog({
    modal: true,
    height: "auto", //Set the height to auto so that it grows along with the iframe.
    width: width
});

    OriginalL'auteur DCNYAM