2012-12-05 37 views
7

jQueryモバイルを使用しており、jQueryポップをページに表示しようとしています。しかし、ページがロードされるとポップアップが中央に表示されず、ポップアップのTOP LEFTコーナーが中央に表示されます。jQueryモバイルポップアップがセンターに表示されない

しかし、ブラウザのウィンドウサイズが変更されると、ポップアップは自動的に中央に移動します(デベロッパーツールのF12キーを押しても)。そして、$( '#popupBasic')へのすべての頻繁な呼び出し。popup( "open");それを画面の中央に表示させます。

しかし、最初にポップアップボックスの左上隅が中央に表示されます。

+0

を開いた後、それを再配置するイベントをポップアップカスタムを使用することができます。上記のように表示されることもありますが、ポップアップが表示されない場合もあります(ただし、DOMを調べることで確認できます)。解決策が何であるか分かりません。 –

+1

も1.3.0とまったく同じ問題を抱えています。クロムの最新バージョン。あなたは修正を見つけたことがありますか? – Dave

答えて

0

これは非常に曖昧な質問です。

あなたが提供しなければならないいくつかの項目:

  • は何ブラウザ、あなたが上でテストしていると、どのバージョン?
  • JQMのどのバージョンですか?
  • JQMとやりとりするカスタムCSSはありますか?

JQM 1.2のように、可能なポップアップオプション:

デフォルト: "起源"

は、ポップアップがセンタリングされるに対する元素を設定します。

"origin"ポップアップが開くと、open()コールに渡された座標の中心に移動します(メソッドページを参照)。

"window"ポップアップが開くと、ウィンドウが中央に表示されます。

jQueryセレクタポップアップが開いたら、セレクタに基づいてjQueryオブジェクトを作成し、その上に中央揃えします。セレクタは、 ":visible"で表示される要素に対してフィルタリングされます。結果が空の場合、ポップアップはウィンドウの中央に表示されます。

Source

+0

それはほぼすべて、私が試してみましたところで表示されている、 クロームバージョン24.0.1312.32ベータメートル のFirefox 16.0.1 HTC Wildfireの2.2.1 JQMのjquery.mobile-1.2.0.min.js ませんカスタムCSS with JQM 私はすべてのポップアップオプションを試しましたが、まだ成功していません。 は、あなたがこの '

SOME LONG CONTENT
' 、その後 '$(文書).bind( 'pageinit'、機能を試すことができますレプリケーションするには({ $( '#のpopupBasic')のポップアップ( "オープン");。 } ); ' –

1

私は同じエラーを得ていました。ページがペイントされた後にポップアップを表示するだけです。

pageinitイベントの代わりにpageshowイベントをリッスンするコードを追加すると、おそらく問題が解決されます。それは私のためにそれを固定した。

10

あなたはpageshowの上でポップアップを再配置してみてください可能性があります

$('#popupLogin').popup('reposition', 'positionTo: window'); 

私は何を経験していることはダウン配置する前に、ページが完全にブラウザによって描画される起こっている数えます。これを克服するには、次のようにポップアップを再配置します。

$(document).on('pageshow', '.selector', function(){ 
    $('#popupBasic').popup('reposition', 'positionTo: window'); 
}); 
+2

私は1つのポップアップdivを使用しています。これは、ユーザーの選択に基づいて異なるイメージを表示するために使用されます。ポップアップにイメージがロードされた後、ポップアップが正常にポストされます。 – dsdsdsdsd

2
$(document).on("popupafteropen", function() { 
    $('#popup').popup('reposition', 'positionTo: window'); 
}); 

あなたは、私がこれと同じ問題を抱えてい

関連する問題