5

div を作成し、ダイアログで開きます。この div をスタイリングして、コンテンツが両方向に 100% に拡張されるようにしました。

これまでに試したこと:divスタイルの設定

#content {
    width:auto !important;
    height:auto !important;
    background-color:red !important;
    display:block !important;
}

デフォルトの div スタイルの設定

$(div).dialog({ dialogClass: 'someStyle' });

.someStyle .ui-dialog-content 
{
    height:auto !important;
    display:block !important;
}

何も機能していないようです!width プロパティをオーバーライドしますが、height プロパティをオーバーライドできません。これをハックする方法は?

私はこのようなことを達成したい: http://jsfiddle.net/S3FQv/

4

3 に答える 3

13

jQuerywidthheightプロパティを使用して、ビューポートのピクセル幅を取得し、それらをスタイルとしてdivに適用できます。

var w = $(window).width();
var h = $(window).height();

//Set up the dialog with the width and height set above.
$('#myDialog').dialog({
    title: 'My Dialog',
    height: h,
    width: w
});

このフィドルを参照してください:http://jsfiddle.net/URpmR/2/

また、ユーザーがブラウザのサイズを変更した場合に関数を再実行するために、いくつかのコードを追加する必要があります。

$(window).resize(myFunction());
于 2013-02-28T10:40:57.917 に答える
1

コンテンツの高さを 100% にするには、この高さをhtmlおよびbodyタグで指定する必要があります。

html, body { height:100%; margin:0; padding:0; }

また、設定autoしても幅や高さが 100% になるとは限りません。同様に、古いバージョンの IE はサポートされておらずwidth: auto;height: auto;

可能であれば!important、既存のスタイルを上書きするためにも使用しないでください。

JSFiddle の例

于 2013-02-28T10:32:04.717 に答える
0

この回答widthにあるようにオプションを設定します'auto'

于 2016-06-06T23:33:58.893 に答える