2013-04-16 96 views
0

我想創建一個模式彈出使用Ajaxtoolkit的modalpopupextender,它像一個魅力。科繼承父母不透明

而彈出窗口顯示我要灰的頁面,並沒有通過分配popuppanel德modalPopup CSS類:

<style type="text/css"> 
    .modalPopup { 
     background-color: gray; 
     filter: alpha(opacity=70); 
     opacity: 0.7; 
    } 

    .modalDiv { 
     background-color:white; 
     height:200px; 
     width:400px; 
     margin-left:auto; 
     margin-right:auto; 
     margin-top:200px; 
    } 
</style> 

的backgroudn是灰色的,但現在我不能讓再次彈出實體內的控件。我試圖把它們放在一個div中,並將div設置爲另一個CSS類,我將不透明度設置爲0和100,但這沒有什麼區別。

我彈出面板是這樣的:

<asp:Panel ID="ModalPanel" runat="server" Width="100%" Height="100%" CssClass="modalPopup"> 
    <div class="modalDiv"> 
     writesomething: 
     <asp:TextBox runat="server" ID="txtModalBox" /><br /> 

     <asp:Button Text="Ok" ID="btnModalOK" OnClick="btnModalOK_Click" runat="server" /> 
     <asp:Button Text="Annuller" ID="btnModalAnnuller" OnClick="btnModalAnnuller_Click" runat="server" /><br /> 
    </div> 
</asp:Panel> 

所以我的問題是,我怎麼有一個面板裏面沒有TRANSPARANT DIV與TRANSPARANT背景?

+1

難道你不能只是添加過濾器/不透明到modalDiv重置那裏的透明度? –

+0

它只是我還是你的文章中不需要的「asp.net」和「ajax」標籤?我可以自己刪除它們,但我沒有很久的「retag」特權,而且我不想錯誤地刪除它們。 – VoidKing

+0

我把它們放進去,因爲我在asp.net頁面中使用了ajax模式擴展器。 – KristianMedK

回答

2

你不能有一個兒童在使用opacity當你應該使用Alpha透明度值rgba(0,0,0,0)使透明度不「繼承」

唯一的缺點是,rgba()那比其父更加不透明是不是supported below IE 9

+0

確實比較透明嗎?我可能已經提出了嚴重的問題,我希望背景是「透視」,面板內的div是「不透」。 – KristianMedK

+0

它的確如此,謝謝。 – KristianMedK

1

如果你想使用早於9的IE版本的rgba,我會提供一個替代方法,但是,我個人不喜歡過度使用它。

http://css3pie.com/documentation/supported-css3-features/

上面的鏈接將帶您到CSS3 PIE項目。它在你的網站上的使用說明非常直接,但簡而言之,它允許非CSS3兼容的瀏覽器呈現某些CSS3功能(rgba就是其中一個功能,更不用說border-radius了,這是另一個不錯的功能) 。

根據我的經驗:一旦用戶拉起頁面,只需要幾分之一秒(大部分時間)來呈現功能,但對我而言,這並不是真正的問題我已經使用它,因爲它看起來像他們的瀏覽器只是仍然加載頁面,因爲用戶習慣於使用舊瀏覽器。

希望這可以幫助那些發現自己需要rgba,但必須保持與IE8(或其他人)完全兼容的人,因爲我知道這正是我發生的事情,並且據我所知,這是唯一可用的解決方案。

+0

upvote for useful link,我最終使用Adrift的回答,因爲在這個項目中不需要向後兼容瀏覽器,而且這是一個快速修復。 – KristianMedK

+0

@ user744610感謝您的支持!是的,我無法確定何時發佈該內容,無論您的客戶要求是否嚴格(可惜)我一直都是如此嚴格,但即使您未必遵守IE 8兼容性,未來其他人也會如此可能偶然發現這一點,並感謝我:) – VoidKing