- Internet Explorer 5/5.5/6 Windows 98/2000/XP;
- JAWS Vocal Synthesis in IE6 Windows XP;
- Netscape 7 Windows;
- Netscape 6.2;
- Mozilla 1.4+ Windows 2000/XP;
- FireFox 0.9+;
- Opera 7 Windows and Linux;
- Lynx (text browser)
- Encompass 0.5 et Dillo 0.8 (non CSS browsers) Linux (Debian);
- Epiphany 1.2 Linux (Debian);
- Galéon 1.2;
- Konqueror Linux (Knoppix);
- Mozilla Linux (Knoppix);
- Internet Explorer 5 Mac;
- Safari 1.0 MacOS X 10.2.8;
- Safari 1.1 MacOS X 10.3;
- Camino MacOS X;
- Firebird MacOS X;
- OmniWeb MacOS X;
- Mozilla 1.6 Mac;
- NeoPlanet 5.1;
Because Sylvain doesn’t have enough knowledge in .NET programming (at the time of this writing at least) he couldn’t release an ASP.NET custom control. There has been a previous example of a user control with Sylvain’s menu, made by guys at Sokhar (a web development company). However, there were a few issues with that one which didn’t go well with my project:
- They used an old version of Sylvain's code, so less compatibility.
- Their code is in C#, my project is in VB.NET, because I needed some changes it didn't work out.
- I thought some improvements could be made besides multi browser issues, such as adding links to main menu titles, a bit improved HTML output, and the ability to change the looks of menu in each page of your project by using the control's properties.
- Access database idea was great but I needed to implement it to my SQL project.
The only downside for some might be that the menu only supports one level branching. This is no problem for me because I believe more than two levels already messes up the looks of the page (and also I read an article on that matter).
I thank first Sylvain for his great work, and then Sokhar for their contribution; it was an important influence for my code.
This is the first update of this DHTML menu user control. In this release, I made some improvements I was planning after I made the first release.
Well, what does the user control I made do? It reads which CSS file to use from the control property “
CSSFile” as defined in your tag definition of the menu control in the aspx page and other properties that tweak menu looks. It loads menu data from an Access file and prepares a nice HTML output which is to be placed in the output of your aspx page. I used Access stored procedures to retrieve some data. I use stored procedures when I work with SQL, and as far as I know, stored procedures are a better way of dealing with data than using strings as command parameters. For those who don’t know about procedures, my code can be a good example work. It was, for me, an educative task as well, because Access (Microsoft Jet Engine, what Access uses as SQL implementation) procedures are defined a bit different than SQL Server ones. I learned about that during this work. My example project is ready for a vertical menu, centered vertically and with gradient filled menu backgrounds. There is also a CSS file included in the first release in the menu folder, so if you want, by changing properties (especially
Using the code
<%@ Register TagPrefix="userCtrl" TagName="CSSMenu" Src="menu/menu.ascx" %>
on top of the aspx page in HTML view, just below the
Page directive. Now, you can add your menu’s tag in the HTML view, as in:
<userCtrl:CSSMenu id="Menu1" runat="server" HRImage="lookxphr.gif"
FollowScroll="false" CenterMenu="true" DefaultHeight="25" DefaultWidth="95"
Vertical="true" DiffWidth="true" CSSFile="vertical.css">
I recommend you to put it above the
form tag that is created automatically by Visual Studio in every aspx page. That’s it. You are ready to go.
Let's examine the properties of menu control:
If a submenu item has an image file with the same name of the value held in this property, then that menu item is considered as a horizontal ruler (separator). Image is loaded as a separator and tiled horizontally. Nothing more is printed for that menu item. Takes a string for filename of horizontal ruler image.
This boolean value of "
True" or "
False" describes whether menu should stay back when page moves forward when scrolled (if page is larger than standard window area) or follow the scroll and be visible all times.
Boolean value and its name tells all. If menu is in vertical mode (defined by
Vertical property) and this property has value "
True" then menu is centered vertically, and horizontally if menu is in horizontal mode.
Another boolean value. "
True" for a vertical menu, "
False" for horizontal.
An integer number for main menu items' default height in pixels.
An integer number for main menu items' default width in pixels.
The name should not confuse you. This boolean value property defines if main menu items are in different widths according to the number of letters in their title if they are in horizontal mode, or if main menu items are in different heights if they are in vertical mode.
This string valued property keeps the name of the CSS file.
Points of Interest
This is one of the two stored procedures used in the Access database. As you can see (if you are familiar with this concept), the syntax is a bit different from SQL's one.
PARAMETERS mainMenuTitleArg Text ( 255 );
WHERE tblMainMenu.mainMenuTitle = mainMenuTitleArg;
mainMenuTitleArg is the argument this procedure takes to find which main menu item's URL we want to fetch from the database. Once the procedure is created in Access database (in Queries section, we prepare this code), it automatically deletes the first line with
For those of you unfamiliar with SQL procedures, here is the stored procedure above in TSQL (SQL implementation of Microsoft SQL Server 2000):
CREATE PROCEDURE sp_mainMenuURL
@mainMenuTitleArg NvarChar (255)
What to do next?
I made many improvements in this release I wanted to after I made version 1.0. Now I think it's time to give the users the facility to have more than one menu in their project. Consider a case where some users (let's say customers) are supposed to get different main menu and submenu items and other users (let's say employees) other items. Of course, in that case, security and more database tables come into consideration.
- Version 1.4
- Everything to be written in HTML is kept in one ASP literal.
- A constructor is added with default values of properties in case user forgets defining them in tag.
- Version 1.0