Forcing the submenu direction and placement

Poster: biographie
Dated: Saturday August 28 2004 - 20:35:16 BST

Please look at my website to see what I am going to describe below. I am just getting started revamping my site, and only have a few pages up and running, but it is enough to test with:

http://scott.korey.name

I want the menu to be down near right hand corner as you will see on the page. When you go to the menu it will start going to the left, but as you pick other sub-menus it will overlap itself. Is there a way to force the submenus to fly out and stay to the left versus always trying to go to the right?

Also, is it possible to set the bottom right corner of the submenu with respect to the parent menu item? I want to keep the menu extending out to the left and up, versus the default method of to the right and down. And then and only then when it get near the left hand edge of the screen would it try to wrap back on itself. I pray that my menus don't take that many layers however. Also, it creates a minor issue because when the menu trys to go down it will overlap the Music Control. Nothing fuctionally bad, just cosmetic.

Next is it possible to have two different menus on the same page? Or should I say use two two different menu_data files for the same page? You will notice if you go the map, and mouse over the dot near hawaii, it pops up the same menu as the lower right hand menu. For the moment I just implemented the code from Milonic's Europe example. I want to, however, make menus like the Europe example for the map area with images in mouseover menus, and use strictly the text titles in the menu down below as a quick method. I can see the menu also having every so slightly different information as well, hence the idea of needing two separate data files.

Poster: Ruth
Dated: Sunday August 29 2004 - 0:52:47 BST

Hi,
To answer your last question first, yes you can have two different menu_data.js files, just name them differently. As an example, text.js and map.js. I've never done the pop up menus so I'm not sure about how they work, but if they work the same as the regular except for the pop up coding, then in reality you wouldn't really need two different data files, you could just do it all in one file [I would keep two, just to keep things straight] If you have two files, just make sure you do NOT name the menus the same. As an example, if you have a u_s in one file then in the other name it u_s1 or something.

Now, your other questions. There is a code called openstyle, it would be placed in the same place as you put the style=whatever alwaysvisible= etc. You can code openstyle to be openstyle="up" or openstyle="rtl" with the up it will open the submenus up, with right to left [leaving align=left for the text as you have it coded] the menu will open on the left side. I have not been able to make it accept both codes. This means you need some logistics.

There is a method under 'methods and functions' which allows you to set the position, I cannot give you help on that because I do not know javascript. If you are able to work with this, then this is what you could do:
set the openstyle="up"; in all the submenus, then use the method to set the position of the submenus. If you know javascript and can write a function you may be able to write one that forces all submenus to open rtl.

I have one suggestion for you to consider. I went to your page and there was no menu. Why? Because my resolution is 800x600 so the page has a scroll bar at the bottom and with the menu set at your coding it is invisible to anyone with that resolution or smaller because it's off the 'actual' window to the right. There is a screenposition option which you can use which can set the menu at bottom right. In most browsers that would set it at the visible bottom right of the screen. If you use it, you would also have to use followscroll=1; because if the person has to scroll down you want the menu to scroll staying at bottom right. But, if the person needs to scroll the window to the right side, then the menu does NOT move to the right, it will stay at the original bottom right of the window. The code for bottom right is placed in the menu definiton [where you put style=whatever] and is screenposition="bottom,right";

I hope this has helped and given you some ideas to try. I did try this, I set the openstyle="up" or the first level submenus, making the subOffsetTop=0; and then I set the openstyle="rtl"; in all the second level submenus [I made them all functioning to work with it] What that did was make all the 1st level submenus open at the right [because the menu is at the full bottom right of the screen] and they opened up, the 2nd level opened at the right, but because the openstyle was used to force rtl I couldn't code them to open up, they opened as usual going down.

Ruth

Poster: biographie
Dated: Monday August 30 2004 - 17:57:50 BST

Thanks Ruth!

This has been very enlightening. This is good news about more than one menu file. I am thinking have the lower right-hand menu be the standard menu_data.js file, and it will be common to every page. And then have a seperate map.js file for pages that need them specialized. I know I can do it all in one file, but for my own sanity. I think I will be able to keep better track of each menu using seperate files.

I am assuming I would just call the second map.js file like the menu_data.js file, yes? No other modifications needed.

That however does beg some other questions:

First, check out the site again, I did some revamping (the resolution problem is still there however).

1. You may notice that I am changing the lower right menu's background color to match the page's background color. I want it to look transparent other than when it has to layer itself over another object. Is it possible to set the bgoffcolor variable dynamically as which ever page is being loaded? I am thinking that I write the color tag of the page to a global variable then have the menu_data.js file read that global into the bgoffcolor. Is this possible?

2. Can I also do the above as far a positioning the menu on the each page via global variables?

If so, that will allow me to get away with one menu_data.js file for all pages, and specific map menu for specific pages. If not, then it is back to one menu file for each file (that sucks).

I am a bit disturbed by what you are telling me about openstyle variable. From what I can gather I can either have the menus go up or have them move right-to-left, but I can't make them do both, yes? Anyway this could become a 5.45 version modification? Or am I asking too much?

I am not to sure about changing the resolution of the pages and where the menu shows up. Well, maybe with the scrolling feature I can move it around. But my concern comes from the imagemaps. If I allow the pages and images to resize for whatever resolution someone is running my imagemaps will not work correctly, and thus my map menus will be off as well. If someone knows how I could fix the pages so everything would still work while adjusting for different screen resolutions, I am all ears.

Side questions about coding up my pages:

Should I be using server-side paths for the mmenus4.js and mmenudom.js files? Currently, as my pages tunnel thru different directories I have to constantly fix the client-side path for each page. It doesn't auto update like the other paths because of the commented out syntax for the script on the page.

This begs the question, can I use server-side paths for any file I am calling instead of the ../../ stuff? Because some items just don't seem to auto update properly with GoLive when you move them around to different directories.

Poster: Ruth
Dated: Monday August 30 2004 - 20:38:09 BST

Answering out of order again:

1. As to the offbgcolor and wanting it the same color as the page, the simplest would be to create a different style using the copyOf method. Use your mainmenuStyle for the main menu as you have it, and create a new style called startmenu like this

It is all by itself, put it below the curly bracket } of the mainmenuStyle definition, notice it doesn't have curly brackets.

2. You can have as many menu data files as you need. If you had 4, you would put in the menu calls for the 3 program files [milonic, mmenudom, mmenuns] and then you would put a call for each data file just like you have it for the one you have now. Just make sure none of the menus, submenus have the same names in the different files.

3. Putting in the ability to do both openstyle=up and rtl, I have no idea what it would entail, I know it would mean writing something in the program. I am not a programmer and the only thing I do know is that when you add something or change something, it's not like having a word and adding a letter, like rid and adding e for ride, only one letter, but in programming it usually means having to reprogram a lot of things. If this is a professional menu, I suggest you contact milonic. You may even find that there is a way to use both options.

4. I wasn't suggesting you change the resolution, but the position of the menu since it will be off the right side of the screen on 800x600. I realize you have directions, but to be truthful I never even saw them the first time, of course that may say something about me Leave the resolution because it works with the map and that's the important part.

5. as to paths, you are asking the wrong person, but I'd think if you have all the menu files in a folder one below the root i.e. root/menuscripts then you could just code them to always be menuscripts/whatever file. That way the menu would just always go to menuscripts which is one step from the root directory. [I'm so bad at paths I have given up, I just always put the danged full path ] Maybe that's why I have a block about them, it's what I started doing years ago.

6. about using variables, I have no clue, there is a section on the menu's variables. but I don't know if that has anything to do with what you are asking?

Ruth

Thank you for all the help!

Poster: biographie
Dated: Monday August 30 2004 - 23:51:29 BST

Thanks you very much Ruth!

I have been going suggestion-by-suggestion trying out what you said. I split the menu into two files no problem. Now I just need to update all the pages accordingly. You can see the change in the menu action on the home page now.

It looks like for now, I am going to use the 'rtl' option and the use a negative offset for the top. It makes things work the way I was hoping (for the most part). Quite a bit of back-and-forth checking to get the offset just right with multiple menu items.

I tried out the transparent option, kind of cool, but not quite what I need. I just want the background to match the overall background of the page. When the menu has to overlay another item (the map or the quicktime control), I want the menu to keep the page's background for itself to keep it readable. Hence why I was thinking of using a global to write the color value. Problem is, I am not a programmer myself, so I am looking for some guidance on what the code should look like for the html files and the menu_data.js file.

Again, thanks for the help.

Poster: Ruth
Dated: Tuesday August 31 2004 - 2:58:30 BST

Could you be a little more detailed about what you are trying to do with offbgcolor etc? I'm not sure I understand you. With the option I gave, you would apply that to the startmenu only and that would be the only one that is transparent so it would be the color that the page behind it is. Are you trying to make the menu the same color that the bgcolor of the page is on each page? You can do that. I have done it on every page on my site by using onclass option, but I also had to code the 'class' into the head of each page, so it can get involved - I don't have a lot to do so I didn't mind taking the time to do all that - If you want that option, then this is what you'd do:

1. code you page color using css
2. create a class using those colors for the menu
3. call the class in the menu

So, as an example, in the head of the document you have:



If you go to this page on my site, and then just click the next buttons [toward the bottom right - [you don't have to read the poetry ] - you'll see the menu change to match the background and text colors on each page.

Poster: biographie
Dated: Tuesday August 31 2004 - 15:49:40 BST

Well, I seem to have gotten everything I asked for. I went to the bookstore last night, and got one of those thick O'Reilly books. Started reading about DOM and stuff.

I am now setting two global variables on each page to tell the menu were to place itself. The code in the html is very simple:

<head>
...
<script type="text/javascript"> //Set Global Variables to set lower right-hand menu position
var menuTop = 550;
var menuLeft = 920;
</script>
...
</head>

Then in the menu_data.js file, I set the position as follows:

openstyle="rtl";
top=menuTop;
left=menuLeft;
position="absolute";


To get the menu to take on the background color of the html page in question, was a lot simpler than I thought it would be. I just set the menu variable to the DOM object:

offbgcolor = document.body.bgColor;

Who would have ever guessed it would be so easy. Sigh. Now everything on the site is looking, and acting 98% how I want it.

I do have one other question, it is about spaces. On the big_island page, I am trying to create a menu that needs spaces for one of the items to get everything aligned correctly. The menu code should look like this:

aI("text=Airports: <b>Kona = KOA</b>;");
aI("text=&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>Hilo = ITO</b>;");

As you can see, I am trying to move the Hilo entry under the Kona entry so everything looks clean, but this doesn't seem to work. What am I doing wrong?

Poster: Ruth
Dated: Tuesday August 31 2004 - 17:27:29 BST

There seems to be something wrong, the menu is not accepting the non-breaking line space if it's in front of the text. Have you considered making an extra aI with the Airports as a header item? You could then actually code it to be a different color if you wish, to have a separator bar below it, to be a bigger text, i.e.

That would make a header item that is yellow, with red text 12px and bold with a white separator that would go all across the menu. Something to think about. I'll tell them about the non-breaking space problem.

Ruth

Poster: biographie
Dated: Tuesday August 31 2004 - 17:43:41 BST

Thanks for the suggestion, but I prefer to keep with the original idea. I don't want the menus to differ from area to area, especially on the same page. I expect the info that I put for each specific site/area to vary. So keeping the same style with the single header I think is best.

Are you agreeing with me that there seems to be a problem with the menu code not accepting the '&nbsp;' syntax? I thought maybe it was just something I was doing wrong. You think something in the menu code is not recognizing it correctly? I looked at the milonic FAQ that is where I learned about using it.

Poster: Ruth
Dated: Tuesday August 31 2004 - 19:11:01 BST

I spoke too soon. It does work, the problem is the equal sign. If you change that to a dash - then it works. = must do something with regard the javascript code.

Ruth

Poster: biographie
Dated: Tuesday August 31 2004 - 21:33:12 BST

COOL!!!

Now it is all working!

I just changed the equal signs to dashes, still looks good.

One small victory! Now I have to get to work on adding content behind all these pages

Poster: Ruth
Dated: Tuesday August 31 2004 - 22:42:02 BST

Hi,
I just got a response from Kevin, who does javascript and he said you might be able to use the equal signs; to do it you need to put backquote around the text itself Note the same ` in front and at the end of the actual text in the item. Just wanted to let you know in case you prefer the =.

Ruth