同じ場所にあるdivのデータを表示/非表示しますか？

Question

私はこの現在のようなものを持っている：と私はもっとこのようにそれを作ることに取り組んでいます：難しい部分はありません

、私は基本的に持っている、前の答えにするために行わ（感謝質問は、狭い画面/モバイルでは最初の画像、大きいスクリーン、タブレットなどでは2番目の画像のように見えます）

緑色の点線の領域はdivになり、その下に2つのボタンが表示されます。私は地図を非表示にする必要があります（googlemapsは隠された/ 0px divを持つのが好きではないので、この場合は一番左に押してください）、報告チェーンのSpacetreeをTheJITから使用します。私たちはすでにjQueryを使用していますので、その下にあるボタンが押されると、緑の点線のdiv（.movi​​ngcontainerと呼ぶ）をマップとspacetreeの間で切り替える最も良い方法は何ですか？

私はこの質問が何度も尋ねられていることを知っています、そして、私は彼らが似たような状況であるかどうか見るためにいくつかの他の質問を見ています。

Answer 1

絶対的な表示（上：何でもいい、左：何でも）の場合、2つのdivを重ね合わせてzインデックスを変更して、どのボタンが押されたかを示します。

EDIT

ちょうど私の第二のコメントはより良い説明します。 <div id="googlemap">と<div id="otherdisplay">があるとします。両方とも<div id="container">に含めることができます。あなたはそれを周りに移動する必要があなたのコンテナのスタイルを設定でき、その内の2つのdiv要素はそれに沿って移動し、必要に応じてサイズを変更する必要があり

#container { 

} 

#googlemap { 
    position:relative; 
    top:0; 
    left:0; 
    z-index:10; 
    max-width:100%; 
    overflow:hidden; 
} 

#otherdisplay { 
    position:relative; 
    top:0; 
    left:0; 
    z-index:1; 
    max-width:100%; 
    overflow:hidden; 
} 

：次に、CSSは次のようなものを見ることができます。

Answer 2

googlemaps divが機能しないことを確認してもよろしいですか？

how to deal with google map inside of a hidden div (Updated picture)

あなたgooglemapsのdivのためdisplay:noneを使用することができるはずのようにその質問/答えによると、それが見えます。その後、必要があれば、jQueryを使用してgooglemaps divにこのCSSを与えます：display:block。