How do I stop a javascript function from working. I have several menu items, when I rollover a menu item I want an image to partially slide in and when I rollout slide back off the screen. If I click the menu item, I wan the image to slide all the way in but I want to stop the rollout function from working for that particulare menu item until another menu item is clicked.
I am not sure how to set this up. I was trying to use a variable isOut to determine when to stop the rollOut function. If I rollover a menu item the value of isOut is set to True, if I click on the menu item, I check to see if its True and which menu item I am on, then continue the slide in, but then I don’t want the mouseOut function to work for that menu element until I click on another menu item. I hope that makes sense.
Here is my code:
[SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]script[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] [/SIZE][SIZE=2][COLOR=#ff0000][SIZE=2][COLOR=#ff0000]language[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]="javascript"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] [/SIZE][SIZE=2][COLOR=#ff0000][SIZE=2][COLOR=#ff0000]type[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]="text/javascript">[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]
[/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]var[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] isOut =[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]""
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]//slide in onClick
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]function[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] slideIn(id){
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]//alert(isOut)
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]if[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2](isOut == [/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'True'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] && id==[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'home'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]){
t1.continueTo(363,2);
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]// isOut = 'False' [/COLOR][/SIZE][/COLOR][/SIZE]
[SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]// stop mouseOut function
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]}
}
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]/*
function slideOut(id){
t1 = new Tween(document.getElementById(id).style,'left',Tween.elasticEaseOut,363,995,2,'px');
t1.start();
}
*/[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]//mouseOut
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]function[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] bounceOut(id){
t1 = [/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]new[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] Tween(document.getElementById(id).style,[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'left'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2],Tween.elasticEaseOut,830,995,1,[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'px'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]);
t1.start();
}
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]//mouseOver
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]function[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] bounceIn(id){
Show(id);
isOut = [/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'True'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]//alert(isOut)
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]t1 = [/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]new[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] Tween(document.getElementById(id).style,[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'left'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2],Tween.elasticEaseOut,995,830,1,[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'px'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]);
t1.start();
}
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]//change background images onClick
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]function[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] changeBg(id){
[/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]if[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2](id==[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'home_btn'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]){
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]//alert('home')
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]document.getElementById([/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'page_bg'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]).style.backgroundImage=[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'url(images/home_bg.jpg)'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2];
}
[/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]else[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] [/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]if[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2](id==[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'about_you'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]){
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]//alert('about_you')
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]document.getElementById([/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'page_bg'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]).style.backgroundImage=[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'url(images/aboutyou_bg.jpg)'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2];
}
[/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]else[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] [/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]if[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2](id==[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'raise_bar'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]){
[/SIZE][SIZE=2][COLOR=#008000][SIZE=2][COLOR=#008000]//alert('about_you')
[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]document.getElementById([/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'page_bg'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]).style.backgroundImage=[/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]'url(images/raisebar_bg.jpg)'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2];
}
}
[/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][COLOR=#a31515][SIZE=2][COLOR=#a31515]script[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]>[/COLOR][/SIZE][/COLOR][/SIZE]
[SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]
[/COLOR][/SIZE][/COLOR][/SIZE]