2

問題:
場所を示す小さなGoogleマップを含むjQueryMobileドキュメントのダイアログページがあります。ダイアログページをロードする前にマップをロードしたい。のように:

$("#dialogPage").bind("pagebeforeshow", function() {
    initializeSmallMap();
});

ただし、divマップが含まれているdisplayプロパティにnoneのプロパティがある場合、Googleマップは正しく機能しません(Googleマップの表示:なしの問題を参照)。また、この関数はページが実際に読み込まれる前に実行されるため、containingdivには当然displaynoneのプロパティがあります。

さて、明らかに、これには簡単な解決策があります。私がする必要があるのは、ページが表示された後にマップを初期化することです。これにより、divブロックの表示プロパティが作成されます。

$("#dialogPage").bind("pageshow", function() {
    initializeSmallMap();
});

ただし、ダイアログはすでに読み込まれているため、マップが表示されるときに、迷惑で目立つちらつきが発生します。

質問:
説明されているちらつきを取り除くにはどうすればよいですか?

可能な解決策:

  • ダイアログがロードされる前に、div含まれているマップにブロックのプロパティを持たせる。displayjQuery Mobileを使用していなかった場合、必要になるまでマップを非表示にしたまま、この効果を実装するのは簡単で簡単です。

    position: absolute;
    left: -10000px;
    display: block;
    

    ただし、jQuery Mobileはページスタイルを自動的に上書きするため、これをどのように機能させることができるかわかりません。

  • マップを含むサイズをGoogleMapsAPIに明示的に通知しdivます。私はこのオプションをグーグルで検索して運がなかったが、私のひどいグーグルスキルを考えると、これが実際に可能であったとしても完全に驚くことはないだろう。
  • その他-ちらつきの影響を取り除く方法については、どんなアイデアでも構いません。上記はいくつかの可能な解決策です。

  • 4

    1 に答える 1

    0
     $("#dialogPage").promise().done(function() {
       //Code to execute when map is loaded.
     });
    

    あなたはそれを試すことができます。attr() で要素を非表示にし、 promise().done が実行されたときに attr() で表示するだけです:)そして、表示プロパティを使用しないでください。

    参照 -約束

    于 2012-07-22T07:47:25.130 に答える