在圖像頂部的透明div

-2

我在圖像頂部有一個透明的div。我想這個div將隱藏圖像，即使在圖像頂部的透明div

它是透明的。我試過使用z-index，但它不起作用。

謝謝。

試圖使用z-index:1;屬性，但不工作。鏈接jsfidle：

http://jsfiddle.net/Z7u8S/3/

什麼我特林做到的是，我有有很多的列表項的無序列表。通過在div上觸摸滑動我希望它下面的div（與圖像）將顯示。問題是，上部div的背景需要透明，否則我沒有問題做到這一點。

來源

2014-06-18 Nir-Z

哪有什麼透明隱藏的東西，背後？一個透明的div就像玻璃 –

分享代碼或撥弄它 – 4dgaurav

你想嘗試類似'opacity：0'嗎？ [** fiddle **]（http://jsfiddle.net/venkateshwar/ENPb5/） –

通過將圖像的css設置爲「visiblity：hidden」而不是使用其他元素來遮蓋圖像，最好隱藏圖像。

例如這裏：http://jsfiddle.net/yuH7E/

<img style="visibility:hidden;" src="whatever" />

來源

2014-06-18 08:04:25 Tope

我需要該圖像將保持在相同的位置，所以當我使用jquery在一個div上滑動時，圖像顯示在文本div –

下，圖像將使用此css保持位置（不同於顯示：無）。最好等到滑動事件完成後再將可見性CSS屬性設置爲可見值。 – Tope

如果你的意思是覆蓋，那就試試這個。使用懸停效果來演示它。

CSS：

.checked{position:relative;width:200px;height:200px;border:1px solid red;} 
.checked img{max-width:100%;} 
.checked div{position:absolute;top:0;left:0;right:0;bottom:0;opacity:0.6;background:transparent;} 
.checked:hover div{background:#BFBFBF;}

HTML：

<div class="checked"> 
    <img src="http://www.vacul.org/extension/site/design/site//images/anonymous-user.png" /> 
    <div></div> 
</div>

演示：http://jsfiddle.net/lotusgodkk/GCu2D/183/

來源

2014-06-18 08:10:03

剛剛嘗試如下 HTML

<div id="mask"> <img src="http://arcadeflip.com/styles/acidtech/imageset/logo.png"> </div>

CSS

#mask{ 
background-color:red; 
    z-index:2; 
} 
img{ 
position:relative; 
z-index:-1; 
}

CHECK http://jsfiddle.net/arshidkv12/S6dHS/

來源

2014-06-18 08:18:55

在圖像頂部的透明div

回答

相關問題