2016-08-08 9 views
0

良い日、私のタイトルは混乱していると知っていますが、私は約2時間の回答を見つけようとしていました。divの画像の前にdivに表示

<div id="lightbox"> 
    <img src="blabla.png"> 
    <div href="#" id="next" onClick="next(1)"></div> 
    <div href="#" id="prev" onClick="prev(1)"></div> 
</div> 

#lightboxはz-indexedです。それらを次の写真にすることはできますか?

答えて

0

#nextおよび#prevは、それらが絶対配置されていると仮定すると、z-indexを持つ必要があります。画像に絶対位置または相対位置もある場合、の#next#prevは画像z-indexよりも高い必要があります。

#lightboxに絶対配置がある場合は、相対配置を持つすべての項目のコンテナが必要です。

+0

あなたはその容器にもっと具体的になりますか?あなたが話していることを知らない。しかし、私は前と次の画像の上にz-indexを高くしています。 –

+0

絶対位置を持つものには相対的な親が必要です。指定されていない場合は、 'body'に相対的です。あなたのボタンを配置したい場合、彼らは何かに相対的である必要があります。あなたのCSSを投稿しても、私はそれをどのように修正するかをより詳細に教えてくれます。または、より良いことに、フィドルを作成します。 –

+0

#lightBox { \t位置:絶対; \tオーバーフロー:非表示。 \t display:なし; \t z-インデックス:999; \tトップ:50%; 左:50%; \tトランスフォーム:translate(-50%、-50%); } #next { \t z-インデックス:900; \t位置:相対; \t高さ:100%; \t幅:25%; \t背景色:青; \t float:right; \t display:なし; } #prev { \t z-インデックス:900; \t位置:相対; \t高さ:100%; \t幅:25%; \t float:left; \t背景色:赤; \t display:なし; } img#lb { 高さ:450px; 位置:相対; z-インデックス:10; } –

関連する問題