halcyon wrote:...Frankly I'm surprised I haven't had any comments from the admins in this thread... surely they are aware of these problems?
Well, speaking for myself, (1) I have been reading the thread, but (2) I have not contributed because I thought Maz's suggestions were quite good, (3) I had nothing to add as a definitive solution, and (4) I am not aware of this particular problem as a known issue with a known solution. Personally, I have never encountered this problem in my own use of the menu, nor have I seen these paricular problems discussed in other threads. I am
aware, however, of various strange behaviors people have encountered when trying to bind the menus to tables. I think that's what you have here... a uniquely odd behavior that results from putting the menu code in a unique table structure.
The sample page
(sample 9) that discusses how to embed a menu in a table, notes the following:
Note that this feature is still a work in progress and issues with tables [sic... should be 'menus'] embedded within tables are still evident, we are working on this though. If you are experiencing problems with relative menu positioning however, try and embed only the menu you want to be included within the table cell. Embedding whole menus is possible but can cause unpredictable results in complex table structures.
You may find that, with your combination of positioning in the table cell, combined with the table's own positioning, that you still have problems. have you considered not placing the manu in a table at all? (I think this is what Maz was getting at with her last suggestion). I believe that it would be pretty straight forward to achieve your desired page layout using the menu system's built-in positioning capabilities, without having to put the menu in a table. No embedding in tables... no odd table-related problems! Here's what your menu_data.js file might contain:
Code: Select all
fontfamily="Arial, Times New Roman, Verdana, Tahoma";
aI("text=Home Page;url=/home.do;status=Back To Home Page;");
aI("text=Manage Sales Regions;url=/marketing/viewSalesRegions.do;");
This would be in menu_data.js, loaded into your html file in the <head>, using the standard recommended method, like so:
Code: Select all
Note that in the menu_data.js file:
(1) Got rid of menuStyle2, since it wasn't used in your sample
(2) Put align="center";
in menuStyle, and removed it from each menu item definition... less coding that way.
(3) Set the menu properties in the "Marketing" menu to achive the effect I think you're looking for. You'll notice that the screenposition
, and menuwidth
properties are currently commented out. I don't think you'll need these properties to get the look you want, but you may end up having to play with them some as you check across browsers.
(4) Removed the non-breaking spaces in the menu items' text, so that if the menu gets squeezed, it can wrap the words and continue to shrink.
One more general suggestion. It looks like you're loading your menu.css file in the same table cell where you're loading the menu scripts. Might be better to load your style sheets in the <head>, and outside of any table.
Hope that helps,