dialogを全画面にするサンプル

by Yoshiharu Kamata

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.16/themes/base/jquery-ui.css">
<div id="dialog">dialog</div>

CSS

.ui-dialog.ui-widget {
    padding: 0;
    border: 0;
    margin: 0;
}
.ui-dialog-titlebar.ui-widget-header {
    display: none;
}
body {
    overflow: hidden;
}

JavaScript

$(function(){
    $("#dialog").dialog({
        width: $(window).width(),
        height: $(window).height()
    });
    $(window).resize(function(){
        $("#dialog").dialog("option",{
                width: $(window).width(),
        height: $(window).height()
        });
    });
});