2

私のサイトには 3 つの異なる Google マップがあります。1 つはデスクトップ、タブレット、モバイルで表示する場合です。ブラウザーのサイズを変更すると、サイズが変更された新しいマップ ポインターが、ページを更新するまで適切な場所に表示されません。 、iframeをリロードしたいだけです。JavaScriptが初めてで、これを試しましたが、機能しません

<script type="text/javascript">
            if( $(window).width() == 985){

                document.getElementById('map-desk').contentWindow.location.reload(true);
            }

            if( $(window).width() == 975){

                document.getElementById('map-tab').contentWindow.location.reload(true);
            }

            if( $(window).width() == 765){

                document.getElementById('map-mob').contentWindow.location.reload(true);
            }

        </script>

画面が特定の幅に等しいときのように、そのIDのiframeがリロードまたはリフレッシュされます

4

3 に答える 3

1

実際のイベントハンドラーはないので、ブラウザーがロードされたときに1回だけ起動します（これは明らかにあなたが望むものではありません）。jQueryを使用しているので、コードを次のようにラップします。

$(window).resize(function() {

    // code goes here...

});

...ブラウザのサイズがわずかに変更されるたびにコードが実行されます。ただし、その正確なピクセル値$(window).width()に達することはめったにない問題に遭遇するでしょう。最善の解決策はわかりませんが、いずれかの方法で+/-30ピクセルの状態をチェックする必要がある場合はうまくいく可能性があります。

于 2013-03-13T14:35:04.227 に答える
0

jQueryで次のイベントを探していると思います

window.onresize = function(event) {
  //your code to resize and reload here
}
于 2013-03-13T14:36:00.917 に答える
0

mapdiv のサイズが変更されると、Google マップが再読み込みされます。mapdiv に 100% の幅を指定します。窓のサイズに合わせます。マップの内容 (レイヤー、マーカー、ルートなど) を変更したい場合は、Google マップ イベントを使用する必要があります。イベント、オプション、およびメソッドは、https ://developers.google.com/maps/documentation/javascript/reference にリストされています。

于 2013-03-13T14:48:38.343 に答える