This is a migrated thread and some comments may be shown as answers.

Setting Transparency

1 Answer 70 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Neil
Top achievements
Rank 1
Neil asked on 05 Dec 2010, 06:44 PM
Hi guys, I'm working with the menu and trying to set the transparency to the background colour of the first sublevel of the menu.

div.RadMenu .rmVertical .rmItem
       {    
           -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
           opacity: 0.3;  
           -moz-opacity: 0.3; 
           line-height: 25px;
           Text-indent: 10px;
           background-color: #1B3456;
           color: White;         
       }

The issue I'm having is that it is setting the transparency to the text it seems? How should I get the background to become transparent? Thanks in advance!

   div.RadMenu .rmVertical .rmItem 
        {     
           /* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; 
            opacity: 0.3;   
            -moz-opacity: 0.3;  */
            line-height: 25px;
            Text-indent: 10px;
            background-color: #1B3456;
            color: White;          
        } 
   div.RadMenu .rmVertical .rmItem 
        {     
           /* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; 
            opacity: 0.3;   
            -moz-opacity: 0.3;  */
            line-height: 25px;
            Text-indent: 10px;
            background-color: #1B3456;
            color: White;          
        } 
   div.RadMenu .rmVertical .rmItem 
        {     
           /* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; 
            opacity: 0.3;   
            -moz-opacity: 0.3;  */
            line-height: 25px;
            Text-indent: 10px;
            background-color: #1B3456;
            color: White;          
        } 
   div.RadMenu .rmVertical .rmItem 
        {     
           /* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; 
            opacity: 0.3;   
            -moz-opacity: 0.3;  */
            line-height: 25px;
            Text-indent: 10px;
            background-color: #1B3456;
            color: White;          
        } 
   div.RadMenu .rmVertical .rmItem 
        {     
           /* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; 
            opacity: 0.3;   
            -moz-opacity: 0.3;  */
            line-height: 25px;
            Text-indent: 10px;
            background-color: #1B3456;
            color: White;          
        } 
 div.RadMenu .rmVertical .rmItem 
        {     
           /* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; 
            opacity: 0.3;   
            -moz-opacity: 0.3;  */
            line-height: 25px;
            Text-indent: 10px;
            background-color: #1B3456;
            color: White;          
        } 
 div.RadMenu .rmVertical .rmItem 
        {     
           /* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; 
            opacity: 0.3;   
            -moz-opacity: 0.3;  */
            line-height: 25px;
            Text-indent: 10px;
            background-color: #1B3456;
            color: White;          
        } 

1 Answer, 1 is accepted

Sort by
0
Kamen Bundev
Telerik team
answered on 05 Dec 2010, 11:15 PM
Hi Neil,

Opacity and filters are indeed setting transparency to all contents of the target element. To set only background transparency you will need to use PNG8 with alpha or PNG24 in all browsers except IE6 which doesn't support it. Another way is using RGBa background colors, but this is supported even less.

Greetings,
Kamen Bundev
the Telerik team
Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
Tags
Menu
Asked by
Neil
Top achievements
Rank 1
Answers by
Kamen Bundev
Telerik team
Share this question
or