PDA

Volledige versie bekijken : Animatie in menu


Finesky
%Europe/Berlin %767 %2005, 19:24
Hallo allemaal:).

Ik ben bezig met een experimentje.

Het idee;

Ik heb 3 blokjes, als je over blokje 1 heen gaat, word die groter en verschuiven de andere 2.
Als je over blokje 2 heen gaat word die groter en verschuift blokje 3.
Als je over blokje 3 heen gaat word die alleen groter.

Ik heb tot nu toe dit (http://www.fs.25cm.nl/ff/menutest.html).
met deze code:

box1.onRollOver = function():Void {
this._width = 50;
box2._x += box1._width - 10;
box3._x += box1._width + box2._width - 20;
}

box1.onRollOut = function():Void {
this._width = 10;
box2._x = box1._x + box1._width + 2;
box3._x = box1._x + box1._width + box2._width + 4;
}

box2.onRollOver = function():Void {
this._width = 50;
box3._x += box2._width - 10;
}

box2.onRollOut = function():Void {
this._width = 10;
box3._x = box2._x + box2._width + 2;
}

box3.onRollOver = function():Void {
this._width = 50;
}

box3.onRollOut = function():Void {
this._width = 10;
}

Dit werkt dus goed.
Maar nu wil ik dat de overgangen geanimeerd gaan.
Om zomaar te proberen kwam ik hier op uit:


var xBox1:Number;
var xBox2:Number;
var xBox3:Number;

box1.onRollOver = function():Void {
this._width = 50;
xBox2 = box2._x += box1._width - 10;
xBox3 = box3._x += box1._width + box2._width - 20;
}

box1.onRollOut = function():Void {
this._width = 10;
xBox2 = box2._x = box1._x + box1._width + 2;
xBox3 = box3._x = box1._x + box1._width + box2._width + 4;
}

box2.onRollOver = function():Void {
this._width = 50;
xBox3 = box3._x += box2._width - 10;
}

box2.onRollOut = function():Void {
this._width = 10;
xBox3 = box3._x = box2._x + box2._width + 2;
}

box3.onRollOver = function():Void {
this._width = 50;
}

box3.onRollOut = function():Void {
this._width = 10;
}

box1.onEnterFrame = doe1;
box2.onEnterFrame = doe2;
box3.onEnterFrame = doe3;

function doe3():Void {
this._x += xBox3 - this._x/3;
}

function doe2():Void {
this._x += xBox2 - this._x/3;
}

function doe1():Void {
this._x += xBox1 - this._x/3;
}


Maar dit werkt niet.

Wie weet hoe ik dit het beste aan kan pakken?

xtr0
%Europe/Berlin %904 %2005, 22:42
miss heb je wat aan deze tutorials:
http://www.flashfocus.nl/forum/showthread.php?t=1380
http://www.flashfocus.nl/forum/showthread.php?t=556

Finesky
%Europe/Berlin %909 %2005, 22:49
Bedankt voor je links xtr0,
maar ik werk liever niet met extensies nu, omdat ik het zelf wil leren:).

Finesky
%Europe/Berlin %908 %2005, 22:48
Niemand een idee?

Fatty Owl
%Europe/Berlin %927 %2005, 23:15
misschien helpt dit je?firstpos1 = box1._x;
firstpos2 = box2._x;
firstpos3 = box3._x;
i = 0;
MovieClip.prototype.easeTo = function(speed, endpos, teken) {
mc = this.createEmptyMovieClip("holder"+i, 10);
i++;
mc.onEnterFrame = function() {
var mymove = endpos-this._parent[teken];
this._parent[teken] += mymove/speed;
lastposi = endpos;
currentposi = this._parent[teken];
if (Math.abs(endpos-this._parent[teken])<1) {
this.removeMovieClip();
}
};
};
box1.onRollOver = function() {
box1.easeTo(5, this._width+10, "_width");
box2.easeTo(5, box1._width+box1._x+20, "_x");
box3.easeTo(5, box2._width+box2._x+20, "_x");
};
box1.onRollOut = function() {
box1.easeTo(5, 10, "_width");
box2.easeTo(5, firstpos2, "_x");
box3.easeTo(5, firstpos3, "_x");
};
box2.onRollOver = function() {
box2.easeTo(5, this._width+10, "_width");
box3.easeTo(5, box2._width+box2._x+20, "_x");
};
box2.onRollOut = function() {
box2.easeTo(5, 10, "_width");
box3.easeTo(5, firstpos3, "_x");
};
box3.onRollOver = function() {
box3.easeTo(5, this._width+10, "_width");
};
box3.onRollOut = function() {
box3.easeTo(5, 10, "_width");
};

Finesky
%Europe/Berlin %011 %2005, 01:16
Hej bedankt man:D.
Hij east nog niet helemaal naar de juiste plaats maar ik begrijp het princiepe nu:).