2

私はたくさんの解決策を試しましたが、どれもうまくいきませんでした。

<div data-role="content">ヘッダーとフッターが固定されたレイアウト（実際の固定は消えない）があり、マップでの塗りつぶしを取得するのが好きです。また、このコンテンツdivで垂直スクロールと水平スクロールの両方を無効にしようとしています。

ソリューションが機能しない：
jQueryMobileの「ページ」に埋め込まれたときにGoogleマップがページの端から
はみ出すjquerymobileのGoogleマップjquerymobile
で高さ100％のdivを作成するにはどうすればよいですか？
JQuery-Mobileコンテンツ領域頭と足の間の100％の高さ
JqueryMobileでdiv[data-role = content]を最大化するjQueryMobile
でフルスクリーンのGoogleマップを表示するにはどうすればよいですか？

4

1 に答える 1

3

1年以上経ちましたが、それでも誰かがこれを解決したい場合は、次のようにします。

jquerymobile1.3.1およびGoogleMapsAPIv3でテスト済み

HTMLでは、これをコンテンツに使用します。

<div data-role="content">
    <div id="mapDiv"></div>
</div>

ヒント：data-fullscreenページのどのdivでも使用しないでください。

それよりも、CSSで、これを使用します。

#mapDiv {
    padding: 0;
    position : absolute !important; 
    top : 40px !important;  
    right : 0; 
    bottom : 58px !important;  
    left : 0 !important;     
}

mapDiv内にマップを作成することを忘れないでください。そうすると、JSは次のようになります。

map = new google.maps.Map(document.getElementById('mapDiv'), mapOptions);

以上です！それを表示しているデバイスを回転させても機能します。

ヒント：ヘッダーとフッターでdata-position="fixed"とを使用する必要があります。data-tap-toggle="false"

于 2013-11-13T17:55:24.807 に答える