Menu / Mega Drop-Down example

2 posts, 0 answers
  1. Martin Horst
    Martin Horst avatar
    39 posts
    Member since:
    Apr 2010

    Posted 01 Feb 2012 Link to this post

    Hi,

    I'm trying to create a menu item like the one in the mega dropdown example.

    Mega Drop Down

    I've added my own html code to one of my RadMenuItem elements which is working fine.

    My only problem now is how i can remove the skined background (I'm using the WebBlue skin) and

    replace it with a plane white background. The realy importent css classes used in the example 

    (like "Products") unfortunately are not part of the source code.

    Best regards

    Martin Horst

  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 01 Feb 2012 Link to this post

    Hi Martin,

    Using the following css class selector you can remove the background image that is applied to the WebBlue skin of the RadMenu:
    /*background image as hover effect of both root and child items */
    div.RadMenu_WebBlue .rmRootGroup,
    div.RadMenu_WebBlue a.rmLink,
    div.RadMenu_WebBlue .rmText,
    div.RadMenu_WebBlue .rmLeftArrow,
    div.RadMenu_WebBlue .rmRightArrow,
    div.RadMenu_WebBlue .rmTopArrow,
    div.RadMenu_WebBlue .rmBottomArrow {
           background-image: none;
    }
     
    /*background and border of the root items */
    div.RadMenu_WebBlue .rmRootGroup {
        background-color: #627F97;
        border: 1px solid #3D556C;
    }
     
    /*dropdown background image applied */
    div.RadMenu_WebBlue .rmGroup,
    div.RadMenu_WebBlue .rmMultiColumn,
    div.RadMenu_WebBlue .rmGroup .rmVertical {
        background-image: none;
        border: 1px solid #768CA5;
    }

    Greetings,
    Kate
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top