Alternative to asp:MenuControl?

  • Thread starter Thread starter Mark B
  • Start date Start date
Thanks Mark.

I have just installed the CSS Adapters.

Now however it's lost all existing theming on the menu control -- it's just
plain text with no spacing and un-aligned dropdowns.
 
Also the suggested solution to the Safari rendering says to add:

<%@ Page ClientTarget="uplevel" ......%>

However my menu control is in the MasterPage and Masterpage doesn't have a
ClientTarget property.

Also is that method still needed if a switch to the CSSFriendlyAdapters has
been made?
 
Yes I currently have a Theme enabled called "Down Gradient Silver Verdana"
which I purchased at www.aspthemes.net.

It's in the web.config as:

<pages theme="Down Gradient Silver Verdana">

In order to set up the CSS Friendly adapters, I:

1) Created a folder called App_Browsers

2) Placed the file "CSSFriendlyAdapters.browser" there

3) Copied "CSSFriendly.dll" to
mywebsite.com\pages\master_page\control_adapters\CSSFriendly.dll

4) Added a reference to the file using Website>> Add Reference. VWD2008
Express then created a folder called Bin and put CSSFriendly.dll there.

5) Ran the website.
 
Here's the Theme's style sheet BTW:


/*-- ASP Menu --*/
/*-- Vertical Orientation --*/
..aspMenu
{
background-color: #eeeeee !important;
background-image: url(./Images/menu_headerbg.jpg) !important;
background-repeat: repeat-x !important;
}

..aspMenuDynamicHover
{
height: 25px !important;
}

..aspMenuDynamicHover tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}

..aspMenuDynamicMenuItem
{
background-color: #eeeeee !important;
height: 25px !important;
}

..aspMenuDynamicMenuItem tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
height: 25px !important;
margin-left: 20px;
margin-right:20px;

}

..aspMenuStaticMenuItem
{
padding: 5px 10px;
border-bottom-color: #cccccc !important;
border-bottom-style: solid !important;
border-bottom-width: 1px !important;
text-align:left;
}

..aspMenuStaticMenuItem tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
text-decoration: none !important;
}

..aspMenuStaticMenuItem tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}


/*-- ASP Menu --*/
/*-- Horizontal Orientation --*/
..aspMenu1
{
background-image: url(./Images/shared_headerbg.gif) !important;
background: url(./Images/shared_headerbg.gif) !important;
background-repeat: repeat-x !important;
height: 34px !important;
padding-left: 5px !important;
padding-right: 5px !important;
}

..aspMenuDynamicHover1
{
}

..aspMenuDynamicMenuItem1
{
background-color: #eeeeee !important;

}

..aspMenuDynamicMenuItem1 tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS' , Arial, Helvetica, 'Sans-serif !important';
font-size: 9pt !important;
font-weight: bold !important;
background-color: #3333CC !important;

}

..aspMenuDynamicMenuItem1 tr td a:Hover
{
color: #000000 Lime !important;
font-family: 'Trebuchet MS' , Arial, Helvetica, 'Sans-serif !important';
font-size: 9pt !important;
font-weight: bold !important;
background-color: #6699FF !important;


}

..aspMenuDynamicMenuLevel3
{
margin-left: 96px !important;
}

..aspMenuStaticHover1
{
}

..aspMenuStaticMenuItem1
{
}

..aspMenuStaticMenuItem1 tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}

..aspMenuStaticMenuItem1 tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}




Mark Rae said:
[please don't top-post]
I have just installed the CSS Adapters.

Now however it's lost all existing theming on the menu control -- it's
just plain text with no spacing and un-aligned dropdowns.
Click to expand...

In which case, you haven't set it up correctly...

http://www.asp.net/CSSAdapters/Menu.aspx

See the THEME CHOOSER radio button list on the left of the above page for
an example of the CSS adapter menu supporting different themes, then click
the "more about CSS & themes" hyperlink...
Click to expand...
 
Hey Mark, I'm having the same issue, not to mention that the menu control
causes IE 7 to slow to a crawl client side. I don't think the javascript used
to render the menu control is all that good, it seems.

I would also like to know of an alternative to the menu control.
 
We haven't done any more work with that just yet.

I can let you know...

Please let me know also if you find a simple solution.
 
Mark, I am still on ASP.NET 2.0, but frameworks are backwards compatible. The
HTML and such that will render, will be the same regardless of framework.

As for customizable, it is 100% customizable with CSS. I will refer you to
their examples to see what can be done in that respect.
http://www.skmmenu.com/menu/Examples/

It is very similar in behavior and customization to the original menu
control, but it seems that they've made some enhancements as far as speed,
and reliability across different browsers.
 
Back
Top