AlexDrop

Thank for the suggestion. Was my first attempt, I separeted the background, from the tween, cause the background may reamain open. Imagine 3 buttons, Menu 1, 2, 3 Once the menu is open, if I press the same button the menu completely close, if I press another button I want close the voices , and the n open the others, while the background remain in place. Pheraps I can't stop the reverse until the background animation e restart forward when changed the voices.

Ok the solution was TweenLite.set([$li, $spot, $img], {clearProps: "all"}); Sorry for bother

I just noticed if I remove relative position and set directly the value -15, I have the effect that I want. But the first time the matrix move from -15 to 0, the others start and remain to -15.

Click open / close, wait for animation and repeat. When repeating animations of a timeline previous reversed and cleared, the relative value of properties keep tracking the last position and not the initial, so the menu voice are going away. Probably is the right behaviout, but how can I achieve the result that I want? I think the error is in the showLink() function. I reset and recreate each time the timeline in this function (and not once globally like the menu background) cause the animated elements change by user click (man / woman / kids) that are not in this example

Same problem on iPhone (I don't know which model, I asked people to test codepen )

What about open an Ice cream shop or a Pub? This is not a real job!!! Edit: same problem on Android 4 / Chrome

Windows 10, Chrome 48. I found the problem in a project with the actions set on dom ready with jQuery, so I don't think depends on codepen, but if you don't have the same behavior I don't know what could be the problem. http://www.fratelliguzzini.com for your curiosity and pleasure Final codepen demo. Sorry but i don't have an account, so I think can't link a fullpage view http://codepen.io/anon/pen/gPJpXg

I tried with Firefox too.

Yes, I discover this in my project. I'll try to call the tween with a delay, so you can check the dom change in realtime Edit: Just opened your link, same problem with me. Chrome 48 Thanks for your reply Re-edit: The problem was not the class to add, the class is added correctly, the problem is that the tween mess with the other classes that contain the same string. "Open-sub" become "-sub".

Hy guys, I love your library since the Flash times I just found what I think is a bug. In the codepen link there is an example. If you tween a class which name is contained in another class, the part of name of tweened class was subtracted on the other class <div class="open-sub" id="tween"></div> if I tween a class with the name "open" TweenMax.to("#tween", 1, {className: "+=open"} ); // +=open or -=open produce same bug the "open-sub" class will become "-sub" Nothing breaking, but could lead in a very tricking result

Don't bother, I tried to use TweenLite to do something that i could do with the ease equation. If someone is interested in, this class return an array with an interval of time that go on with an ease equation example import com.greensock.easing.* import fl.transitions.easing.Regular; var elementi:Number=10 var time:Number = 3 var delay:Number = 1 var tempo = easeTime.getTime(elementi, Regular.easeOut, time, delay) trace(tempo) //1.57,2.08,2.53,2.92,3.25,3.52,3.73,3.88,3.97,4 var tempo = easeTime.getTime(10, Linear.easeOut, 10, 1) trace(tempo) //2,3,4,5,6,7,8,9,10,11 var tempo = easeTime.getTimeOff(10, Linear.easeOut, 10, 1) trace(tempo) //11,10,9,8,7,6,5,4,3,2 And so on... In nice to use the array as a delay for the tweens in a cicle elementi = arrayMC.length var tempo = easeTime.getTime(elementi, Regular.easeOut, 2,0) for (i<0;i TweenLite.to(arrayMC[i], .5, {_x+"500", delay:tempo[i]}) } The Class /* ################# # Name: easeTime Class # Author: Pomili Alessandro # Date: 17 Nov 20009 # Description: La classe restituisce un array nel quale gli indici contengono un intervallo di numeri, con progressione calcolata sulle funzione di ease ########### */ package { import flash.events.*; import fl.transitions.easing.Regular; public class easeTime { public function easeTime ():void { throw (new Error("La classe è di tipo singleton e non può essere istanziata")); } //restituisce un intervallo tra delay e tempo (es tra 0 e 5, o tra 3-7) public static function getTime(elementi:Number, myease:Function=null, tempo:Number=1, delay:Number=0):Array { var arrayTempo = new Array(); if (myease==null) { myease = Regular.easeOut}; for (var i:uint = 1; i <= elementi; i++) { //myease(i, delay, ((i/elementi)/i)*elementi, elementi)*tempo // questa istruzione calcola il valore di ease sul numero degli elementi tra l'intervallo di tempo 0, e tempo) arrayTempo.push (Math.round(myease(i, delay/tempo, ((i/elementi)/i)*elementi, elementi)*tempo*1000)/1000); //round*1000/1000 arrotonda a 3 decimali } return arrayTempo; } //restituisce un intervallo tra tempo e delay public static function getTimeOff(elementi:Number, myease:Function=null, tempo:Number=1, delay:Number=0):Array { var arrayTempo:Array = getTime(elementi, myease, tempo, delay) return arrayTempo.reverse() } //restituisce un intervallo dove i lati dell'array contengono gli intervalli più piccoli public static function getTimeCenter(elementi:Number, myease:Function=null, tempo:Number=1, delay:Number=0, blReverse:Boolean=false):Array { var meta_elementi:Number = Math.ceil(elementi/2) var arrayMetaTempo:Array = new Array() if (blReverse){ arrayMetaTempo = getTime(meta_elementi, myease, tempo, delay) }else{ arrayMetaTempo = getTimeOff(meta_elementi, myease, tempo, delay) } var reverse:Array = reverse(arrayMetaTempo) if (elementi%2!=0){ //se gli elementi sono dispari tolgo il primo indice reverse.shift() } var arrayTempo:Array=arrayMetaTempo.concat(reverse) return arrayTempo } //restituisce un intervallo dove i lati dell'array contengono gli intervalli più grandi public static function getTimeSide(elementi:Number, myease:Function=null, tempo:Number=1, delay:Number=0):Array { return getTimeCenter(elementi, myease, tempo, delay, true) } //crea una copia inversa dell'array passato private static function reverse(arrayTempo:Array):Array { var reverse:Array = new Array() reverse = reverse.concat(arrayTempo) return reverse.reverse() } } }

Hi guys, please forgive my poor english I wrote this code import com.greensock.* import com.greensock.plugins.*; import com.greensock.easing.*; TweenPlugin.activate([EndArrayPlugin]); var mioArray:Array = [0]; var elementi:Number=10 var tempi:Array = new Array() function aggiungi(){ tempi.push(mioArray[0]) } TweenLite.to(mioArray, elementi, {endArray:[3], onUpdate:aggiungi, onComplete:anima, useFrames:true, ease:Regular.easeOut}) (I've also wrote a little class if you are interested in) What this code do, is to tween in an array an interval of numbers. Whit this array next I will tween my object like this function anima(){ for (var i=0;i var cc:MovieClip = _root.attachMovie("cerchio", "c"+i,i); cc._y = (cc._height+5)*i; TweenLite.from(cc, 2, {_x:Stage.width, ease:Bounce.easeOut, delay:tempi[i]}); } } So I don't have a linear start of the tween (something like delay: i*.3), but a start with an ease function. The only "problem" with this code is that we have to wait for the frames in order to create the array (TweenLite.to(mioArray, elementi, {endArray:[3], onUpdate:aggiungi, onComplete:anima, useFrames:true, ease:Regular.easeOut})) There could be a way in order to have te array more speedily