(828) 862-6667

Telerik Blogs



RADmenu example

by Rich Winslow | Aug 08, 2010
/* Default button color and background with no button image
Background color must be none so visited colors can change
*/
div.RadMenu .rmHorizontal .rmText
{
color:white;
background-color:none;
background-image:none;
}

div.RadMenu .rmFocused:visited
{
background-color:navy;
background-image:none;
}

div.RadMenu .rmRootGroup
{
/* background-color no affect
color not affect
*/
background-image:none;
}

div.RadMenu .rmLink
{
background-color:orange;
color:yellow;
background-image:none;
}


div.RadMenu .rmGroup li
{
text-align:left;
background-image:none;
}

div.RadMenu .rmGroup
{
background-image:none;
}

/* Default button color and background with no button image, note: color can not be changed here, see .rmHorizontal .rmText */
div.RadMenu .rmText
{
/* color no affect */
font-weight:bold;
background-image:none;
/* cannot set background-color or it affects the visited background as well as default */
}

/* Top row item background has a different color to show it is the currently selected branch in the menu without the default Sitefinity buttom images
color doesn't work here
*/
div.RadMenu .rmItem .rmFocused
{
background-image:none;
/* color no affect */
background-color:#d11713; /* red was #65a543 green */
}

/* Item in left vertical menu when hovering on a subordinate item to the right
where background has a different color to show it is the current page in the menu
without the default Sitefinity buttom images */
div.RadMenu .rmVertical .rmItem .rmFocused
{
background-image:none;
background-color:#d11713; /* red was #65a543 green */
/* color no affect */
}

div.RadMenu .rmLink
{
background-color:#26316f; /* blue */
background-image:none;
}

div.RadMenu .rmVertical
{
/* background-color no affect */
background-image:none;
}

div.RadMenu .rmFocused:hover
{
color:#d11713; /* red */
/* background-color no affect */
background-image:none;
}


/* Menu text color change and background color change on hover for root and vertical with no default button image */
div.RadMenu .rmHorizontal .rmText:hover
{
background-image:none;
background-color:white;
color:#d11713; /* red */
}

div.RadMenu .rmText:hover
{
color:#d11713; /* red */
background-color:orange;
background-image:none;
}


/* Background color when vertical menu is opened and the mouse is NOT on the menu item
*/
div.RadMenu .rmVertical:hover
{
/* color no affect */
background-color:#26316f; /* blue */
background-image:none;
}

/* The left side of the button to the left of the text is having its background color changed with no default button image
This includes the root or top row
Left tab
*/
div.RadMenu .rmHorizontal .rmLink:hover
{
background-color:white;
color:#d11713; /* red */
background-image:none;
}

/* Left button when sliding a subordinate menu next to it */
div.RadMenu .rmItem:hover
{
background-color:#6671af; /* blue */
color:#d11713; /* red */
background-image:none;
}

/* Left button when sliding a subordinate menu next to it */
div.RadMenu .rmLink:hover
{
background-color:white;
background-image:none;
color:#d11713; /* red */
}

/* Root menu background color when down inside a vertical menu below the root item */
div.RadMenu .rmRootGroup .rmExpanded
{
background-image:none;
background-color:#6671af; /* blue */
/* color no affect */
}

/* Top row background for all non-focused buttons without the default Sitefinity buttom images */
div.RadMenu .rmRootGroup
{
background-color:#26316f;
color:navy;
background-image:none;
}

/* Make sure the vertical menus align text to the left */
div.RadMenu .rmGroup li
{
text-align:left;
}

/* Note: color doesn't work here */
div.RadMenu .rmVertical
{
background-color:#26316f;
background-image:none;
}

/* Hover on left button, slide out a subordinate vertical menu on the right, this is the background on the subordinate menu. Note: color doesn't work here

*/
div.RadMenu .rmSlide .rmVertical .rmGroup
{
background-color:white;
background-image:none;
}

/* Very left edge of vertical menu */
div.RadMenu .rmSlide .rmVertical .rmGroup .rmItem
{
background-image:none;
background-color:#26316f;
/* color no affect */
}



Comment

  1.    
     
     
      
       

RADmenu example

by Rich Winslow | Aug 08, 2010
/* Default button color and background with no button image
Background color must be none so visited colors can change
*/
div.RadMenu .rmHorizontal .rmText
{
color:white;
background-color:none;
background-image:none;
}

div.RadMenu .rmFocused:visited
{
background-color:navy;
background-image:none;
}

div.RadMenu .rmRootGroup
{
/* background-color no affect
color not affect
*/
background-image:none;
}

div.RadMenu .rmLink
{
background-color:orange;
color:yellow;
background-image:none;
}


div.RadMenu .rmGroup li
{
text-align:left;
background-image:none;
}

div.RadMenu .rmGroup
{
background-image:none;
}

/* Default button color and background with no button image, note: color can not be changed here, see .rmHorizontal .rmText */
div.RadMenu .rmText
{
/* color no affect */
font-weight:bold;
background-image:none;
/* cannot set background-color or it affects the visited background as well as default */
}

/* Top row item background has a different color to show it is the currently selected branch in the menu without the default Sitefinity buttom images
color doesn't work here
*/
div.RadMenu .rmItem .rmFocused
{
background-image:none;
/* color no affect */
background-color:#d11713; /* red was #65a543 green */
}

/* Item in left vertical menu when hovering on a subordinate item to the right
where background has a different color to show it is the current page in the menu
without the default Sitefinity buttom images */
div.RadMenu .rmVertical .rmItem .rmFocused
{
background-image:none;
background-color:#d11713; /* red was #65a543 green */
/* color no affect */
}

div.RadMenu .rmLink
{
background-color:#26316f; /* blue */
background-image:none;
}

div.RadMenu .rmVertical
{
/* background-color no affect */
background-image:none;
}

div.RadMenu .rmFocused:hover
{
color:#d11713; /* red */
/* background-color no affect */
background-image:none;
}


/* Menu text color change and background color change on hover for root and vertical with no default button image */
div.RadMenu .rmHorizontal .rmText:hover
{
background-image:none;
background-color:white;
color:#d11713; /* red */
}

div.RadMenu .rmText:hover
{
color:#d11713; /* red */
background-color:orange;
background-image:none;
}


/* Background color when vertical menu is opened and the mouse is NOT on the menu item
*/
div.RadMenu .rmVertical:hover
{
/* color no affect */
background-color:#26316f; /* blue */
background-image:none;
}

/* The left side of the button to the left of the text is having its background color changed with no default button image
This includes the root or top row
Left tab
*/
div.RadMenu .rmHorizontal .rmLink:hover
{
background-color:white;
color:#d11713; /* red */
background-image:none;
}

/* Left button when sliding a subordinate menu next to it */
div.RadMenu .rmItem:hover
{
background-color:#6671af; /* blue */
color:#d11713; /* red */
background-image:none;
}

/* Left button when sliding a subordinate menu next to it */
div.RadMenu .rmLink:hover
{
background-color:white;
background-image:none;
color:#d11713; /* red */
}

/* Root menu background color when down inside a vertical menu below the root item */
div.RadMenu .rmRootGroup .rmExpanded
{
background-image:none;
background-color:#6671af; /* blue */
/* color no affect */
}

/* Top row background for all non-focused buttons without the default Sitefinity buttom images */
div.RadMenu .rmRootGroup
{
background-color:#26316f;
color:navy;
background-image:none;
}

/* Make sure the vertical menus align text to the left */
div.RadMenu .rmGroup li
{
text-align:left;
}

/* Note: color doesn't work here */
div.RadMenu .rmVertical
{
background-color:#26316f;
background-image:none;
}

/* Hover on left button, slide out a subordinate vertical menu on the right, this is the background on the subordinate menu. Note: color doesn't work here

*/
div.RadMenu .rmSlide .rmVertical .rmGroup
{
background-color:white;
background-image:none;
}

/* Very left edge of vertical menu */
div.RadMenu .rmSlide .rmVertical .rmGroup .rmItem
{
background-image:none;
background-color:#26316f;
/* color no affect */
}



Comment

  1.    
     
     
      
       















Company Info  |   Contact Us  |   Site Map  |   Terms  |   Privacy Policy  |  

Automated Results Computer Consulting LLC, 222 South Caldwell Street, Brevard, NC 28712 (828) 862-6667