如何使圖像透明的背景幻燈片顯示在asp.net

我使用一個簡單的jQuery的圖像幻燈片，它工作正常，但事情是，我想放在幻燈片放映一個小圖像並且該圖像應該對帶下劃線的圖像幻燈片顯示爲透明，但我嘗試將圖像幻燈片放置在一個大Div中，並且在同一個幻燈片div中放置了一個小div中的圖像，但幻燈片放映正常，但我可以「看不到它由具有較小的不透明度上面的半透明圖像。於是好心幫我解決問題...... 這是我如何放置兩個股利......如何使圖像透明的背景幻燈片顯示在asp.net

<div class="logo"> 
    <img src="imag/header1.png" alt="" height="100%" width="100%" /> 

    </div> 

    <div id="slideshow"> 



    <img src="imag/slider-1.jpg" alt="" class="active" height="100%" width="100%"/> 
    <img src="imag/slider-2.jpg" alt="" height="100%" width="100%" /> 
    <img src="imag/slider-3.jpg" alt="" height="100%" width="100%" /> 
    <img src="imag/slider-4.jpg" alt="" height="100%" width="100%" /> 

    <img src="imag/slider-5.jpg" alt="" height="100%" width="100%" /> 




</div>

css：

#slideshow { 
    position:absolute; 
    height:50%  /*300px*/; 
    width:95.5%; 
border-style:solid; 
border-color:Red; 

} 

#slideshow IMG { 
    position:absolute; 
    top:0; 
    left:0; 
    z-index:8; 
} 

#slideshow IMG.active { 
    z-index:10; 
} 

#slideshow IMG.last-active { 
    z-index:9; 
} 
div.logo 
{ 
    position:relative; 
    height:27%; 
    width:100%; 
    opacity:0.1; 
    filter:alpha(opacity=60%); /* For IE8 and earlier */ 
    margin-top:0%; 
    margin-left:0p%; 
    zindex:1; 


}

來源

2012-01-30 user1177313

您可以在#slideshow DIV的頂部position:absolute的.logo股利。請確保您使用的是24位的透明PNG文件和設置的#slideshow的z-index比.logo

看起來你也上z-index

來源

2012-01-30 04:41:21

確保兩個#slideshow周圍包含div和.logo設置爲位置：相對的。 – 2012-01-30 04:42:36

中缺少.logo風格的連字符的z-index下正如您可能知道的那樣，您不能在幻燈片div中包含徽標，否則它將成爲幻燈片的一部分。因此，請在幻燈片和徽標周圍放置一個相對定位的容器。將徽標設置爲絕對定位並給它一個高z-索引，以便它保持在幻燈片的頂部。

http://jsfiddle.net/jXJwG/2/

<div id="container" style="position: relative;"> 
    <div id="slideshow"> 
     <img src="http://placehold.it/300x300/ff0000" alt="" class="active" /> 
     <img src="http://placehold.it/300x300/ffff00" alt="" class="active" /> 
     <img src="http://placehold.it/300x300/ffffff" alt="" class="active" />  
    </div> 
    <img src="http://placehold.it/60x60" alt="" style="position: absolute; top: 30px; right: 30px; z-index: 1000;" /> 
</div>

來源

2012-01-30 04:51:01 mrtsherman

如何使圖像透明的背景幻燈片顯示在asp.net

回答

相關問題