Radmenu Semi-Transparency affect

8 posts, 0 answers
  1. lmills@travizon.com
    lmills@travizon.com avatar
    1 posts
    Member since:
    Aug 2007

    Posted 15 Oct 2009 Link to this post

    Hi - i'm using the latest Radmenu control and was wondering how you might be able to set the background transparency of the menu that opens up after you place the mouse over the top-most level.

    So in essence when you move your mouse over the menu, the cascading menu has a nice semi-transparent look.

    Thanks

  2.
  3. Schlurk
    Schlurk avatar
    812 posts
    Member since:
    May 2009

    Posted 16 Oct 2009 Link to this post

    This code will set the transparency of a RadMenuItem to 70%:

    <style type="text/css">  
        .rmItem  
        {  
            opacity: 0.7;  
            -moz-opacity: 0.7;  
            filter: alpha(opacity=70);  
        }  
    </style>  

    Hopefully that does the trick :)
  5. rcba
    rcba avatar
    2 posts
    Member since:
    Nov 2009

    Posted 13 Jan 2010 Link to this post

    This didn't work for me in IE.  Instead I tried doing the same to the .rmGroup and .rmVertical and it works on all browsers but it does not work in IE7.  It does not show the children of the first tree nodes.

    Does anyone know the solution?

    Thanks,
    RB
  7. Schlurk
    Schlurk avatar
    812 posts
    Member since:
    May 2009

    Posted 14 Jan 2010 Link to this post

    This website goes over how to implement opacity in all browsers. I believe if you are running into this issue only in IE7 you might be running in compatability mode and therefore you need to add a rule. You might also need to change the order of the CSS rules:

    <style type="text/css">   
        .rmItem   
        {   
            -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 
            filter: alpha(opacity=70);  
            opacity: 0.7;   
            -moz-opacity: 0.7;  
        }   
    </style>   

    I think that should fix everything with your IE issues :)
  8.
  9. rcba
    rcba avatar
    2 posts
    Member since:
    Nov 2009

    Posted 20 Jan 2010 Link to this post

    Thank you for you reply.  I tried your suggestion but for some reason using .rmItem prevents IE from showing the radmenu at all.  Using .RadMenu_Custom .rmGroup, .RadMenu_Custom .rmGroup .rmVertical transparency works on all browsers but on IE7 still.
    I've also tried setting back the opacity values if the browser is IE7 but it is not working either.

    <style type="text/css">.RadMenu_Custom .rmGroup, .RadMenu_Custom .rmGroup .rmVertical {filter:alpha(opacity=90); opacity:.9; -moz-opacity:.9;}</style>

    <!--[if lt IE 8 ]>

    <style type="text/css">.RadMenu_Custom .rmGroup, .RadMenu_Custom .rmGroup .rmVertical { opacity:1; -moz-opacity:.1; filter:alpha(opacity=100); }</style>

    <![endif]-->

    Any other suggestions?

    Thanks,
    RB
  11. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 22 Jan 2010 Link to this post

    Hello rcba,

    This issue may be related to the layout of your page, can you share a live URL or a sample project with these changes applied and we will try to help you fix it. I can convert this forum post to a support ticket if you prefer privacy. Thank you in advance.

    Best wishes,
    Kamen Bundev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  13. sircutbreaker
    sircutbreaker avatar
    111 posts
    Member since:
    Oct 2007

    Posted 14 Sep 2010 Link to this post

    I am having the same issue.  I placed the filter to give the dropdown the transparency effect.. and now it doesnt show at all in ie.

    here is a live url

    http://multimediabyjeff.com/shop2/

    any help would be much appreciated.

    Regards,

    Jeff
  14.
  15. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 14 Sep 2010 Link to this post

    Hello sircutbreaker,

    The issue here is that .rmItem is stackable and when filters are stacked in IE, the results are unpredictable. The fix is easy - just apply the filter and opacity to the .rmLink element and remove the background from .rmItem in order to make the above transparency visible.

    Kind regards,
    Kamen Bundev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top