JavaScriptでモーダルウィンドウのサイズを変更する
-
03-07-2019 - |
質問
特定のアイテムが非表示/表示されているときに、モーダルダイアログウィンドウのサイズを変更しようとしています。
window.resizeTo(800, 600);
上記のようなコードを使用してみましたが、うまくいかないようです。モーダルダイアログであり、通常のウィンドウではないからだと思います。これをどのようにサイズ変更できるかについての提案はありますか?
解決
要素またはコンテナIDを識別して、次のような操作を行います。
document.getElementById('MyModal').style.height = '500px';
document.getElementById('MyModal').style.width = '800px';
これにjQueryを使用している場合、実際のshow modal関数にアタッチできるため、かなり簡単になります。
編集
上記のJavaScript関数内で、MyModalはコンテナまたはモーダルのIDになります。たとえば、モーダルの外側の要素にDIVを使用している場合、DIVは次のように設定します。
<div id='MyModal' class="IFNEEDED">CONTENTS OF MODEL</div>
編集#2
これは「モーダル」ではないためです今日のほとんどが説明しているように、新しいウィンドウのポップアップのように、このコード行はあなたのために機能するはずです(こちら):
window.open('http://www.pageresource.com/jscript/jex5.htm','mywindow','width=400,height=200')
他のヒント
ウィンドウ自体の中からモーダルダイアログウィンドウのサイズを変更しようとしている場合、javascript window.resizeTo()またはwindow.resizeBy()を使用したくなるかもしれません。
ただし、これらは機能しません。代わりに、次を使用します。
window.dialogWidth='640px';
window.dialogHeight='480px';
PS Rsolberg:ポスターはモーダルダイアログウィンドウと言っていました。それは私がそれを説明する方法のように思えます。それがjQueryに関連していると解釈できるかどうかはわかりません。混乱を避けるため、jQueryの回答を削除します。
所属していません StackOverflow