0

画像の上に div を表示しようとしています。ユーザーが画像を入力すると、分割が表示される必要があります。これは、ホバー効果を意味します。しかし、画像の下に表示されている div のメイン ディビジョンにマウスを合わせるとどうなりますか。

私のコードは次のとおりです。

 <div class="bgimg">
 <img width="100%" height="100%" data-id="1" src="data:image/jpeg;">
 <div id="changeBackPicture" style="display: none;"> 
  <a id="ChangeBAKPicture" href="javascript:void(0)">Change BackGround Picture</a>
 </div>     <-- This division need to display above the image --->
 <div class="primg"></div>
 <div id="uname">xyz </div>
 </div>

CSS コード:

#changeBackPicture
{
float:right;
margin-top:-70px;
margin-right:500px;
width:270px;
height:35px;
margin-left:-3px;
margin-right:-3px;
}

下の図は、分割が現在どのように表示されているかを示しています。画像の上に分割を表示する必要があります... ここに画像の説明を入力

誰かこのようなことを行う方法を教えてください........ありがとう。...

4

3 に答える 3

3

z-index は、特定の要素のスタック順序を設定する CSS プロパティです。スタック順序が大きい要素は、常にスタック順序が小さい別の要素の前にあります。

要素が z-index を使用するには、要素が絶対、相対、または固定で配置されている必要があります。

#changeBackPicture { position: relative; z-index: 9999;}

リソース: http://www.w3schools.com/cssref/pr_pos_z-index.asp

于 2013-02-26T20:55:33.830 に答える
2

それは実際にはそれほど複雑ではありません.必要なことを正確に行うため、 Z Index CSS プロパティを確認する必要があります.

カバーしようとしている画像とカバーしている div の両方に Z インデックスを設定してください。

于 2013-02-26T20:48:32.700 に答える
1

オーバーレイ div に z-index を追加しようとしましたか? 50 の z-index を指定して、それが機能するかどうかを確認します。絶対位置を指定して、画像 div の上に配置することもできます。

于 2013-02-26T20:49:30.053 に答える