28

編集して再度開く:

Google マップ上に要素を配置するのは難しいようです。z-index を使用しても、以下に説明する問題は解決されません。Google マップは、高い z-index を使用している場合でも、他のいくつかの要素の上にとどまります。

質問は：

Google マップの一部を div でカバーすることは可能ですか?

次のポップアップがあります。

ここに画像の説明を入力

しかし、このポップアップを上に移動してマップ上に表示すると、非表示になります:

ここに画像の説明を入力

何かを強制的に一番上に、常に画面に表示されるオブジェクトにする方法は?

CSS プロパティ シートで z-index を設定しようとしましたが、うまくいきませんでした。

DIV であるポップアップが実際に常に他のすべての上に設定されるように設定できる HTML/CSS プロパティはありますか?

4

7 に答える 7

11

を使用していposition: relativeますか?

position: relativeこのdivに他のdivとの関係でz-indexが必要なため、設定してからz-indexを試してください。

ところで、ブラウザは動作するかどうかを確認することが重要です。IE も Firefox も良いものではありません。

于 2013-09-10T23:18:07.117 に答える
10

位置を絶対に設定してみてください。 

#yourDiv{
    position: absolute;
    z-index: 10;
};
于 2014-12-28T00:18:37.000 に答える
5

DIV の z-index を他の DIV よりも 1 大きい値に設定します。また、DIV に設定されているposition以外のものがあることも確認する必要があります。static

CSS:

#someDiv {
    z-index:9; 
}

詳細はこちら: http://coding.smashingmagazine.com/2009/09/15/the-z-index-css-property-a-comprehensive-look/

于 2013-09-11T00:19:56.390 に答える
0

これを行う 1 つの形式は、相対として設定された DIV 内に展開するパネルを挿入することです。

<div style="position:relative">
  <div style="position:absolute; z-index: 1000;">
    your code
  </div>
</div>

最初の div を使用してページ内の特定の領域に内部コンテンツを配置し、2 番目の絶対値はコンテナーを参照する必要があります (相対であるため)。この場合の z-index はコンテナーも参照され、それより高い場合は、コンテナは一番上にある必要があります。スタイルを CSS クラスに配置し、絶対 div のサイズを変更して、ホバーまたは制御したい別のアクションで展開することができます。

これが役立つことを願っています

于 2015-04-30T14:39:20.313 に答える
-1

ドロップダウンは常に一番上に表示されます。この問題の唯一の解決策は、画像が表示されているときにドロップダウンを非表示にし (display:block または visibility:visibile)、画像が非表示になっているときにドロップダウンを表示することです (display:none または visibility:hidden)。

于 2015-09-11T03:20:16.220 に答える