code problem rollover

Poster: Roadserver
Dated: Friday July 23 2004 - 9:06:11 BST

I have the following code:

============================================================
function setParentOverImage(imageName)
{
parentItem = getParentItemByItem(_itemRef);
_mi[parentItem][32] = imageName;
BDMenu(_mi[parentItem][0]);
}

_menuCloseDelay=500 // The time delay for menus to remain visible on mouse out
_menuOpenDelay=150 // The time delay before menus open on mouse over
_subOffsetTop=5 // Sub menu top offset
_subOffsetLeft=-10 // Sub menu left offset



with(menuStyle=new mm_style()){
offbgcolor="#9EB8CD";
offcolor="#000000";
padding=5;
itemwidth=114;
fontsize="12";
fontstyle="normal";
fontweight='bold';
fontfamily="Arial";
onbgcolor='#d8d8d8';
pagecolor="black";
pagebgcolor="#64C3AB";
headercolor="#000000";
headerbgcolor="#ffffff";
}


with(gezellig=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
orientation="horizontal";
aI("showmenu=submenu;image=menu_fotos/02lachen.jpg;overimage=menu_fotos/02lachen_over.jpg;");
}

with(gezellig=new menuname("submenu")){
style=menuStyle;
aI("text=Bevel protectors;url=http://;onfunction=setParentOverImage('menu_fotos/huilen.jpg');offfunction=...........................;");
aI("text=Pipe Closure;url=http://;onfunction=setParentOverImage('menu_fotos/boos.jpg');offfunction=.....................;");
}

drawMenus();
============================================================

It works!
But there is one problem.
I will give the offfunction (see points above) the same rollover as in mainmenu......
A kind of reset!
To begin at the start, like the begin.
How can i do that?

Poster: Ruth
Dated: Friday July 23 2004 - 13:55:57 BST

Hi,
When Kevin wrote the code for you he included the offfunction returning the image back to the original overimage that was the rollover for the new 3rd image. Using your example from menu sample #17

If you want to go back to the original starting image of 02lachen.jpg you might try putting that into the offfunction as the image to call when you mouseoff and see if that will work.

Ruth

Poster: Roadserver
Dated: Friday July 23 2004 - 15:17:32 BST

Thanks for your help!

But there must be two image at the begining:

see this:
ai("showmenu=submenu;image=menu_fotos/02lachen.jpg;overimage=menu_fotos/02lachen_over.jpg;");

Like 02lachen.jpg and 02lachen_over.jpg

The mainmenu has also a rollover.
Thats what i need.

What you say is that i start with one image, but thats not mij idea.

Poster: kevin3442
Dated: Friday July 23 2004 - 17:25:04 BST

Hi,

I think you may have misunderstood Ruth's reply; she's not suggesting that you use only one image. She's saying that you can use the setParentOverImage() function to set the parent item's overimage to anything you want. In the example you've given, to reset the parent item's overimage to its original, the offfunction in the items would be as follows:
(always keeping in mind that each aI() definition is one one line, with no wrapping)

Hope that helps,

Kevin

Poster: Ruth
Dated: Friday July 23 2004 - 17:37:22 BST

Yes, I understand there are two images in the main menu rollover but when you 'turn' off the function it can't go back to two images showing, it can only show one as Kevin's code clearly shows, the offfunction has one image. In his code he used the main menu 'over' image. The one you want to show is the one you put in the offfunction section.

Main menu item with rollover:
When moused over 02lachen.jpg changes to 02lachen_over.jpg.

Submenu item Bevel has the function in it but haven't put an image in the offfunction section:

If you want the image to return to 02lachen_over.jpg then it would be if you want it to return to 02_lachen.jpg then put that in place of 02lachen_over.jpg. Or are you now asking for a different function that will put some different image in the main menu?

Ruth

Poster: Roadserver
Dated: Friday July 23 2004 - 17:59:25 BST

If i go with the mouse over 02lachen.jpg in de mainmemu 02lachen_over.jpg appears in the mainmenu.
THATS OKE!

If i go to the submenu for each subchoice there appears a other picture in the mainmenu.
THATS ALSO OKE!

But the rollover of the mainmenu (lachen.jpg and lachen_over.jpg) disappears if i have entered (com back of) the submenu. The rollover is not there. Only one picture (like 02lachen_over.jpg or 02lachen.jpg)
Thats my problem!

I hope you understood my problem now.

Poster: kevin3442
Dated: Friday July 23 2004 - 18:25:35 BST

Hi,

It looks like Ruth and I posted at the same time. Did you read my reply above? It's basically the same as the last Code sample that Ruth provided. That should work.

If the mouseover in the main menu item stops working, it can only be because you passed the wrong image in offfunction=setParentOverImage(). For example, suppose your main menu item is:

and your submenu item is:


If you pass 02lachen.jpg in the offfunction (as above), then you will effectively disable the rollover effect in the parent (main) menu item. The rollover will still actually work, but now the image and overimage properties are both set to 02lachen.jpg; so even though there are two image properties, they are the same image, so there's no visual difference from the user's point of view. To avoid that, do not pass the parent item's image property setting in the submenu item's offfunction.

Instead, if your submenu item is

then it should work, because you've reset the parent item's overimage to it's original, 02lachen_over.jpg.

Kevin

Poster: Roadserver
Dated: Friday July 23 2004 - 19:12:02 BST

You have right!!

Now it works!

But not all the time.....
Sometimes there appears a picture out the submenu in the mainmenu if i go to the mainmenu (strange).
I work with differend data_menu.js files in one menu (design).
And sometimes i go to the menu and the menu don't roll open, if i repeat it then it opens. Why not the first time.

Are this two things problems with parameters?

Did you have an idea?

Sorry but i can't put the menu on the web at this moment.

Poster: Roadserver
Dated: Saturday July 24 2004 - 10:25:39 BST

Help!

I will forward!

Thanks for the help before!

Poster: Roadserver
Dated: Saturday July 24 2004 - 14:24:44 BST

Yes, there is the link :

http://roadserver.tripod.com/menu.htm

http://roadserver.tripod.com/menu_geel.js
http://roadserver.tripod.com/menu_groen.js
http://roadserver.tripod.com/menu_rood.js

It run not perfect i think maby you have tips for me to make the menu running perfect (script, not the design .
parameters etc.

See reply (Posted: Fri Jul 23, 2004 6:12 pm Post subject:) above!

Poster: Maz
Dated: Saturday July 24 2004 - 17:59:09 BST

I see tripod, they have so much stuff going on.

Nothing comes up on the url

Your have 3 preloadimages, probably not good.

Do you really need the menu in a table?

I see you have 3 menus in the table with 3 different scripts, it looks like you are complicating it, however maybe that's the way it works for you, I'm not really sure.

Try placing the main files from head to under the body tag.

If you keep the menu in tables then use position=relative in the style just above menu items. Remove all but one preloadimages, make that the last script. It might even work at the bottom of the page before /body, sometimes drawmenus is placed at the bottom of the page, but since you have so many script and drawmenus I'm not sure, probably unnecessary.

Let's try to get this cleaned up so it works first, then I can see what's going on.

I would usually have all the menus in one menu_data.js with different style names, okay just took at look at that, ya you have menustyle in 3 different files, so you have repeated the same style= and styles, that would be very confusing. If you use more than one, each one has to have its own style name.

I think you may have this all wrong, but then I'm not sure what you are trying to do until I can see it working.

Do you want a different style in each td?
If they are the same style then have all the main styles in one td,
aI()
aI()
aI()

Or
style=1ststyle;
style=2ndstyle;
style=3rdstyle;

with(1ststyle=new mm_style()){

with(2ndstyle=new mm_style()){

with(3rdstyle=new mm_style()){

You might find the beginners section of the forum helpful.


with(milonic=new menuname("Main Menu")){

with(milonic=new menuname("2nd Menu")){

with(milonic=new menuname("3rd Menu")){

Or place them all in one menu and put all the main menu in one td.

Then allow the menu to place them, eg. itemwidth=50px;

Hope this is not too confusing.

maz

Poster: Roadserver
Dated: Saturday July 24 2004 - 20:31:22 BST

I have remake the testmenu with your tips.

The new links

http://roadserver.tripod.com/menu.htm
http://roadserver.tripod.com/menu.doc (htm ==> doc)
(right click ==> save)


http://roadserver.tripod.com/menu_data.js
(right click ==> save)

I think the parameters of the folowing vars are not oke?
Because the menu are not oke bij rolling over etc the speed etc?
Sometimes the menu hanging?
Also if i test on my own computer (not online).

_menuCloseDelay=500 // The time delay for menus to remain visible on mouse out
_menuOpenDelay=150 // The time delay before menus open on mouse over
_subOffsetTop=5 // Sub menu top offset
_subOffsetLeft=-10 // Sub menu left offset

Wat means this var exactly?

If you go (very)fast from the submenu(red) to the mainmenu(yellow) the menu go not open. And also for other colours.

Sometimes there appears a picture out the submenu in the mainmenu if i go to the mainmenu rolover (strange).

I will make a place (20px) between de subemenus right and left with a collour not above and under.

I have to put the menu in a table because i have make a design in Fireworks. I have see the turorial for tables

I use IE 6.0

Poster: Maz
Dated: Saturday July 24 2004 - 21:13:04 BST

Okay now I see yellow red and green, but no links, need to look further.

I think you need

drawMenus();

before </script>

Poster: Roadserver
Dated: Saturday July 24 2004 - 21:29:33 BST

I know.

But that are/is not my problem(s).
Look one reply of me above that are my problems.
Help me with this problems, please.

I have change drawMenus();

Poster: John
Dated: Saturday July 24 2004 - 22:57:37 BST

I see a few problems...

1. You have "Main Menu" defined twice - once in the _data file and once in the HTML. Try taking it out of the _data file.

2. I'd move the preloadmenuimages call up to right below the _data file call in the head.

Right now, nothing is working.

Poster: Roadserver
Dated: Sunday July 25 2004 - 11:30:23 BST

I put the files on a new server today.
Tripod is sucks!

Poster: Roadserver
Dated: Sunday July 25 2004 - 12:59:05 BST

http://members.chello.nl/j.weber4/menu.htm

http://members.chello.nl/j.weber4/menu.doc

http://members.chello.nl/j.weber4/menu_data.js



THANKS FOR YOU HELP!!

I have desolve these problems.
1. It is necessary to put the Main Menu twice, because the menu is in a
table. If you put i only in the htm file it don't works.
See tutorial.
2. I have put the preloadmenuimages script direct under the menu script.

But my problems stay.

===============================================
I think the parameters of the folowing vars are not oke?
Because the menu are not oke bij rolling over etc the speed etc?
Sometimes the menu hanging?
Also if i test on my own computer (not online).

_menuCloseDelay=500 // The time delay for menus to remain visible on mouse
out
_menuOpenDelay=150 // The time delay before menus open on mouse over
_subOffsetTop=5 // Sub menu top offset
_subOffsetLeft=-10 // Sub menu left offset

Wat means this vars exactly?

If you go (very)fast from the submenu(red) to the mainmenu(yellow) the
menu go not open. And also for other colours.

Sometimes there appears a picture out the submenu in the mainmenu if i go
to the mainmenu rolover (strange).

I will make a place (20px) between de subemenus right and left with a
collour not above and under.
===============================================

Poster: Ruth
Dated: Sunday July 25 2004 - 17:35:29 BST

The problem is not in the menu, nor in the function code Kevin wrote, and I do not know if there is a solution because there are too many variables in how a person uses the mouse, what direction they may go, which menu they may go to next, their setting for mouse speed, how fast various parameters of the menu can complete their functions and the function you have and go on to the next function. I can't explain in detail because I don't know javascript in order to give you the actual functions that are going on, but in everyday terms: if you mouse over the submenu of Main Menu 1 and get to item 4 then quickly move to Main Menu 2, the menu function to close a submenu when another main menu item is moused over takes over and closes the Main Menu 1 submenu. Because the person moved rapidly to Main Menu 2 it might be that the closing of that first submenu happened before the function you have could be completed, because it wasn't completed the Main Menu now has the submenu 4 image as it's overimage not the original overimage and it seems because it didn't have the original overimage the menu function to change the original overimage back to it's original starting image also didn't take place. So, when you open that Main Menu 1 again it is still showing the submenu 4 substitute image. I hope that helps, but I don't know that there is any solution to the problem.

Ruth

Poster: Maz
Dated: Sunday July 25 2004 - 18:17:14 BST

Hi I see you have it working now.



Although I don't know technically but
menu close delay is something like mili-seconds delay on closing
menu open delay is the time it takes to open

You can adjust these to see if it makes any difference.

sub offset top is where the submenu opens at the top position and left left of the main menu, your's are lined up fine, no worry there.

I don't know if I should suggest this, but maybe if the whole menu was written in the td it would respond better. Maybe try a copy to see if it makes any difference, so you can switch back if not.

I like what you did.

maz

Poster: Roadserver
Dated: Sunday July 25 2004 - 19:32:32 BST

Thanks for the reactions.

You forgot to say how i do this:
I will make a place (20px) between de subemenus right and left with a
collour not above and below.

I understand your explaining Ruth.
But why this problem can't be desolve:
Sometimes there appears a picture out the submenu in the mainmenu if i go to the mainmenu rolover (strange).

There must be a solution to reset the menu?

There must be persons how now the code to change this?
Because many people irritating this by visiting my site.

I like the help!!!! (ruth, Maz, John and kevin3442).

MY COMPLIMENTS!!!

Poster: Ruth
Dated: Sunday July 25 2004 - 20:54:21 BST

I didn't say it couldn't be solved, I do not know. The reason you sometimes get what you want is because your mouse moved slow enough to let all the functions do what they needed to do.
As I said I do not know javascript. I do have a sense of what the menu is doing.
1. On Main Menu mouseover it is performing two functions: changing the image to overimage and opening the submenu.
2. on 1st item submenu mouseover it is changing the Main menu overimage
3. on 2nd item mouseover it is performing two functions: the offfunction of the first item and then the onfunction of the new item
4. on moving off the submenu it is trying to perform the offfunction of whatever item you were on, and to close the submenu.
5. If you have gone rapidly to Main Menu 2 it is not only trying to complete the offfunction and to close the first submenu, it is also trying to open the new submenu and to switch the image to overimage for Main Menu 2.

I do not know if there is a way around this or some way to control the mouse speed of a visitor.

One thing you might try is to go back to 3 separate files as you had at first and to separate the menus by some space so there is space the person has to cross with the mouse to get to the next menu. Again this may depend on how the person uses the mouse. So, I do not know if this will work.

Ruth

Poster: Roadserver
Dated: Monday July 26 2004 - 16:52:10 BST

The menu works better now?
Why ...................... i don't now.

I have start to make a new menu (begin to the end).


But now there is a error after scrolling in my menu in de IE (not direct):

'_mi[...] is empty or no object
line 5

=================================
function setParentOverImage(imageName)
{
parentItem = getParentItemByItem(_itemRef);
_mi[parentItem][32] = imageName;
BDMenu(_mi[parentItem][0]);
}
=================================

What's the problem?