[解決済み] ブラウザのサイズを変更したときにjQuery UIダイアログを自動で中央に配置するには?
2022-12-29 08:52:55
質問
jquery UI dialogを使用しているとき、1つのことを除いてはすべてうまく動作します。 ブラウザのサイズが変更されたとき、ダイアログはちょうどそれが本当に迷惑なことができる最初の位置にとどまる。
試しに http://jqueryui.com/demos/dialog/
モーダルダイアログの例をクリックし、ブラウザのサイズを変更してください。
ブラウザのサイズを変更したときに、ダイアログを自動的に中央に配置できるようにしたいです。 これは、私のアプリのすべてのダイアログに対して効率的な方法で行うことができますか?
どのように解決するのですか?
を設定する
position
オプション
はこれを強制するので、すべてのダイアログで同じセレクタを使用してください。
#dialog
を使用しているすべてのダイアログに同じセレクションを使用してください(もし見つからない場合は、すべてのjQueryのようにアクションは実行されません)。
1.10以前のjQuery UI
$(window).resize(function() {
$("#dialog").dialog("option", "position", "center");
});
jQuery UI 1.10 またはそれ以上
$(window).resize(function() {
$("#dialog").dialog("option", "position", {my: "center", at: "center", of: window});
});
同じ jQuery UI のデモページに、上記のコードだけを追加したのがこちらです。
にハンドラを追加しています。
resize
イベントに
.resize()
で、適切なタイミングで再中心をトリガーします。
関連
-
[解決済み] jQueryを使って要素のIDを取得するにはどうすればよいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み] jQueryで複数のクラスを持つ要素を選択するにはどうすればよいですか?
-
[解決済み] jQuery Ajax呼び出し後のリダイレクトリクエストを管理する方法
-
[解決済み] jQuery UIダイアログのクローズボタンを削除するには?
-
[解決済み] jQueryを使用してCSSのdisplay noneまたはblockプロパティを変更するにはどうすればよいですか?
-
[解決済み】jQueryでチェックボックスがチェックされているかどうかを確認するにはどうすればよいですか?
-
[解決済み] jQuery UIダイアログをajaxで読み込んだコンテンツの幅に合わせて自動的にリサイズする。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] jQueryのpreventDefault()が発動しない
-
[解決済み] 複数のクラスを削除する(jQuery)
-
[解決済み] jQueryで複数のCSS属性を定義するには?
-
[解決済み] WebKit の event.layerX と event.layerY に関する問題
-
[解決済み] jQueryを使ってロールオーバー時に画像ソースを変更する
-
[解決済み] jQueryを使用して配列から特定の値を削除する方法
-
[解決済み] jQueryでloading spinnerを表示するには?
-
[解決済み] jQueryの.ajax()メソッドが私のセッションクッキーを送信しないのはなぜですか?
-
[解決済み】jQueryで入力不可属性をトグルする。
-
[解決済み】フォームのhiddenフィールドにjQueryの".val() "を使って値を設定してもうまくいかない。