Introducing lag in Drop Down Menus

[surdzz]

Hi Guys,

I am trying to recreate the menu effect at MM website. Notice that theres a lag associated with the rollovers.

I can hard code all buttons, don't really need an XML file. I manged to somewhat get the basics right. I noticed that onRollOver function does not work if placed under another onRollOver function. Therefore I used onMouseMove function instead. Code below -

stop();
//*/
button1.onMouseMove = function() {
if (button1.hitTest(_root._xmouse, _root._ymouse, true)) {
button1.submenu1.gotoAndStop("visible");
} else {
button1.submenu1.gotoAndStop("invisible");
}
};
//
button2.onMouseMove = function() {
if (button2.hitTest(_root._xmouse, _root._ymouse, true)) {
button2.submenu2.gotoAndStop("visible");
} else {
button2.submenu2.gotoAndStop("invisible");
}
};
//


I prefer to put code at one place in a file. So here its placed at the root.


I just can't get the lag in place. I have attached a file here. Can anyone give pointers as to how I should layout the file and add the lag feature.

Thanks

[Jiggie]

Hi!
Here try this.

[surdzz]

Hi Jiggie,

Thanks for your help. In your case I can't put buttons inside onRollOvers. So I tried your script like this -
stop();
var t:Number = 0;
var lagTime:Number = 15;

button1.onMouseMove = function() {
if (button1.hitTest(_root._xmouse, _root._ymouse, true)) {
button1.submenu1.gotoAndStop("visible");
} else {
this.onEnterFrame = myLagFunction();
}
};
//
function myLagFunction() {
if (t > lagTime) {
button1.submenu1.gotoAndStop("invisible");
delete update_mc.onEnterFrame;
t = 0;
} else {
t++;
}
}

Still its giving problems, Something doesn't seem to work here. May be we can use a setInterval in myLagFunction(); Any ideas?

[Jiggie]

Hi!
i checked your code and found some mistakes, here try this:
stop();
var t:Number = 0;
var lagTime:Number = 15;

button1.onMouseMove = function() {
if (button1.hitTest(_root._xmouse, _root._ymouse, true)) {
this.onEnterFrame = myLagFunction;
} else {
button1.submenu1.gotoAndStop(\"invisible\");
}
};
//
function myLagFunction() {
if (t > lagTime) {
button1.submenu1.gotoAndStop(\"visible\");
delete this.onEnterFrame;
t = 0;
} else {
t++;
}
}Hope this works.

[Jiggie]

oops made some minor changes
stop();
var t:Number = 0;
var lagTime:Number = 15;

button1.onMouseMove = function() {
if (button1.hitTest(_root._xmouse, _root._ymouse, true)) {
this.onEnterFrame = myLagFunction;
} else {
button1.submenu1.gotoAndStop("invisible");
}
};
//
function myLagFunction() {
if (t > lagTime) {
button1.submenu1.gotoAndStop("visible");
t = 0;
delete this.onEnterFrame;
} else {
t++;
}
}

Hope this works.

[Jiggie]

here, i used it on your sample.fla

[surdzz]

Hey Jiggie,

Just checked out your function. It works good. Thanks a lot for your suggestion and effort.

I modified it a little bit to accomodate more than one menu and reversed the Lag on 'rollOut' (I need it to be sticky). Had to use discrete variables for each button.

So here is the final code that seems to work with me. It also takes care of overlapping. But I would have to repeat this for EVERY button..! Can we use a for function somehow? I tried it but "turning off all others" gets tricky..

Any suggestions?


stop();
t1 = 0;
lagTime = 15;
myObj1 = button1.submenu1;
myObj2 = button2.submenu2;
//*/
button1.onMouseMove = function() {
if (button1.hitTest(_root._xmouse, _root._ymouse, true)) {
t1 = 0;
// Turn on submenu for this
myObj1.gotoAndStop("visible");
// Turn off all others << This is tricky if we use for function.
myObj2.gotoAndStop("invisible");
delete this.onEnterFrame;
} else {
// Lag starts
this.onEnterFrame = function() {
if (t1>lagTime) {
// Turn current submenu off
t1 = 0;
delete this.onEnterFrame;
myObj1.gotoAndStop("invisible");
} else {
// Run the clock upto 15 times
trace("t1 = "+t1);
t1++;
}
};
}
};
button2.onMouseMove = function() {
if (button2.hitTest(_root._xmouse, _root._ymouse, true)) {
t2 = 0;
myObj2.gotoAndStop("visible");
myObj1.gotoAndStop("invisible");
delete this.onEnterFrame;
} else {
this.onEnterFrame = function() {
if (t2>lagTime) {
t2 = 0;
delete this.onEnterFrame;
myObj2.gotoAndStop("invisible");
} else {
trace("t2 = "+t2);
t2++;
}
};
}
};

[Jiggie]

Hi!
yup you can use a for function here so that you wont have to do it on every button.
Here a simple way of accessing multiple button.

for (n=0; n<20; n++) {
mybuttons = this["mc_button"+n]
mybuttons.gotoAndStop(2)
mybuttons._alpha = 20
//basically you get the point :)
}


there you go, this script controls all 20 buttons named "mc_button0" "mc_button1"... "mc_button19".

hope this helps!