do things procedural

[sina_izad]

hi
i was writing code for a java script menu. in my code on a mouseover i hide what ever submenu is currently showing and show the corresponding submenu.

i have a function like:

function showMenu(menuID) {
hide(currentMenu);
show(menuID);
alert('test');
}

but on a mouse over java script does everything simultaneously(i.e shows the alert before hide() is terminated.

why is that? and how can i make it to do hide and then show and then alert each after the termination of the previous? :confused:

[Exuro]

but on a mouse over java script does everything simultaneously(i.e shows the alert before hide() is terminated.I'm pretty sure the browser just waits until the JavaScript has finished running before it updates the display. Are the alerts showing the wrong values, or does it just not look right when the alert comes up? Since you're using onmouseover, maybe it would be a better idea to send your values out to a <div> instead of popping them up in an alert window? The alert popping up kind of screws with the mouse activity, and I'd think that would make debugging difficult...

[sina_izad]

thanx for your reply
but the functions show() and hide() are basicaly loops that i use to animate the div tags for submenus. so what it means is that when i roll the mouse over a button on menu it should first animate the submenu and move to a position where its hidden and then move the corresponding submenu in place to show it and when the loops is done and show() is terminated pop the alert.

thanx

[Exuro]

but the functions show() and hide() are basicaly loops that i use to animate the div tags for submenus.

My guess is that show() and hide() actually use setTimeout() rather than looping, am I right? In this case, your showMenu() function would return from hide() after the first "iteration", call show(), which would also return after just one "iteration", and then do the alert().

If I'm right, then you should be able to fix this by chaining your functions together... Something like this:function showMenu(menuID) {
hide(menuID);
}

function hide(menuID) {
if (!isHidden(currentMenu)) {
// Animate currentMenu hiding
setTimeout("hide(currentMenu);",100);
}
else {
show(menuID);
}
}

function show(menuID) {
if (!isHidden(menuID)) {
// Animate menuID showing
setTimeout("show('"+menuID+"');",100);
}
else {
alert('test');
}
}