Berry

Aweome stuff, thank you! I was able to use the hack and it does the trick. Is there a way to do an if/else statement using the currentProgress of a tween or timlime? Or maybe if the timline is complete or not? For instance: if (timelinemax.currentProgress = 0) {do something} else{ do something}

Still loving TweenMax and TimlineMax! Right now I am trying to get several image icons to rotate around another image in a circle while having the rotating images alway remain verticle. Do you happen to know off hand if a good way to achieve this with tweenMax? Right now my idea is to use tweenMax.to and individualy tween the image icons to the next position in a set of nested timlines. It seems to possibly be the right solution but at the moment the timeing and positioning of each tween is a little off. One thing I can't seem to do is have the main timeline delay for 3 seconds and then play the nested timlines. The nested timlines seem to ignore the delay and play right away. Is there a good way to get the sequnced tweens to play right after each other to create a smooth rotating effect? Or is there a better wat to achieve this? Below is my code: // Frame #4 var f4Clip1 = new TimelineMax(); var f4Clip2 = new TimelineMax(); var frame4Tl = new TimelineMax({delay:3, paused:true}); f4Clip1.insert( TweenMax.to($('#retailerExpert'), 1.5, {css:{right: "193px",top: "71px"}})); f4Clip1.insert( TweenMax.to($('#dealerExpert'), 1.5, {css:{right: "134px",top: "223px"}})); f4Clip1.insert( TweenMax.to($('#agroExpert'), 1.5, {css:{right: "236px",top: "349px"}})); f4Clip1.insert( TweenMax.to($('#scientistExpert'), 1.5, {css:{right: "396px",top: "334px"}})); f4Clip1.insert( TweenMax.to($('#farmerExpert'), 1.5, {css:{right: "502px",top: "241px"}})); f4Clip1.insert( TweenMax.to($('#industryExpert'), 1.5, {css:{right: "470px",top: "101px"}})); f4Clip1.insert( TweenMax.to($('#academicExpert'), 1.5, {css:{right: "311px",top: "34px"}})); f4Clip2.insert( TweenMax.to($('#retailerExpert'), 1.5, {css:{right: "134px",top: "223px"}}),1.4); f4Clip2.insert( TweenMax.to($('#dealerExpert'), 1.5, {css:{right: "236px",top: "349px"}}),1.4); f4Clip2.insert( TweenMax.to($('#agroExpert'), 1.5, {css:{right: "396px",top: "334px"}}),1.4); f4Clip2.insert( TweenMax.to($('#scientistExpert'), 1.5, {css:{right: "502px",top: "241px"}}),1.4); f4Clip2.insert( TweenMax.to($('#farmerExpert'), 1.5, {css:{right: "470px",top: "101px"}}),1.4);; f4Clip2.insert( TweenMax.to($('#industryExpert'), 1.5, {css:{right: "331px",top: "41px"}}),1.4); f4Clip2.insert( TweenMax.to($('#academicExpert'), 1.5, {css:{right: "193px",top: "71px"}}),1.4); frame4Tl.append(f4Clip1); frame4Tl.append(f4Clip2);

Thanks again for the advice. It was a syntax error and I got it working again in ie7. The video series is great, I am already starting to grasp the concept of timelines, although I know I have a lot more to learn. A few questions for you: 1) In my timelines if I use append to insert to insert as tween it does not seem to listen to my sdjustment of the tween time. For instance below it is not waitng 2 seconds to start this tween : f3Clip1.insert( TweenMax.to(weeds, 4.5, {css:{left:"100px", top:"187px"}, ease:Linear.easeNone}, 2)); same thing for the append: f3Clip2.append( TweenMax.fromTo(weedBtn, .2, {css:{width:"249px"}}, {css:{width:"+=6px", left:"-=3"}, yoyo:true, repeat:1}, 5 )); But when I insert a tween into a timeline using with the followin it listens to the timing: frame2Tl.to(seedBag11, 1.75, {css:{top: '375px'}, ease:Bounce.easeOut}, 3.25); Am I doing somethin wrong with my use of insert and append? 2) This may be a question for the modernizr formum but do you know if I can use modernizr with tweenMax? So for instance on my web page in the 4th frame I have a rotating animation but in ie the png is rendering a black outline during thte tween (I see this issue had been addressed in the forum already) So is there a way to use modernizr to detect ie and hide the rotation tween in ie only and display another tween completley? Then after the tweens are complete show the same element on all browsers? Thanks!

Thank you so much for your help! I really do love what Greensock js is capable of and it's ease of use. I can't wait to get more comfortable with how to utilze all of it's capabilities. I am trying to grasp the concept of how to nest and control nested tweens. What does ".insert" accomplish? I got the rain drops working in ie8 however now all of the tweens are not working in ie7. Any ideas? Thanks again!

I am new to both Jquery and TweenMax but so far I love using TweenMax js. I took the code from http://www.snorkl.tv...script-preview/ exploding bunnies example and tweaked it a bit to get a effect of multiple rain drops falling on the screen. It looks good in firefox, chrome and safari but in ie 7 and 8 (I don't currently have access to ie 9) it is not displaying correctly. There is only 1 rain drop displaying and it is grey instead of the white png. Also I have it paused when loaded and have a click event to play the tween but it is playing upon load. Any ideas of what I am doing wrong? here is my code: var rainDrops = $(".rainDrop"); var frame3Tl = new TimelineLite({paused:true}); rainDrops.each( function (index){ var delay = 1 + (Math.random()*2); var duration = 1 + (Math.random()*3); var left = 7 + (Math.random()*840) + "px" var rainDrop = $(this); $(this).css({'left': left}); frame3Tl.insertMultiple([TweenMax.staggerTo(rainDrop, duration, {css:{rotation:1}, ease:Power1.easeOut, delay:delay, repeat:-1}), TweenMax.staggerTo(rainDrop, duration, {css:{rotate:"1deg", top:"504px"}, ease:Linear.easeNone, delay:delay, repeat:-1}), ]); } ) Thanks for your help!