sounddevisor

Jonathan - Thanks for your quick reply! My apologies for not explaining clearly enough - the code I posted IS the secondary timeline. The "main" timeline looks like this: <script> var timerOne = setTimeout(firstMove, 1500); function firstMove(){ TweenLite.to("#woman", 1.5, {left:-80, ease:Quad.easeOut}); TweenLite.to("#Text01", 1, {autoAlpha:1, delay:1.2}); TweenLite.to("#studyMask", 1, {autoAlpha:1, delay:1.2}); TweenLite.to("#closeButton", 1, {autoAlpha:1, delay:1.2}); TweenLite.to("#openButton", 1, {autoAlpha:1, delay:1.2}); } var timerTwo = setTimeout(secondAnimation, 6000); function secondAnimation(){ TweenLite.to("#woman", 1.2, {autoAlpha:0}); TweenLite.to("#Text01", 1.2, {autoAlpha:0}); TweenLite.to("#Text02", 1.2, {autoAlpha:1, delay: 1.2}); } etc. etc. </script> So, I have a series of timers, each of which launches a block of animations. These timers drive the primary animation of the banner. The secondary timeline ("tl" in the code I posted above) allows the viwer to open (and close) a sliding "drawer" that provides additional information. As is stands, the timeline works correctly, and the "drawer" slides up and down as intended. The problem is that the main animation conintues in the background, which is both distracting, and since the banner does not loop, it means the viewer will miss some of the content. So I want to pause the main animation whenever the drawer is open. I tried adding a line to my function slideStudyUp, so that it reads: function slideStudyUp(){ tl.play(); timeline.pause(); } It looks correct to me in terms of syntax, but it doesn't work. Could the problem be that I don't really HAVE a "main" timeline? I didn't create one using TimelineLite, I just created a series of JavaScript timers to launch my animation functions. Would this work better if I wrap the main animation in it's own timeline? Thanks so much for any help!

Hi - In a banner I'm working on, I have a secondary timeline which controls an object sliding up and down on my screen. The secondary timeline works properly, but I'd also like to be able to pause the main timeline when the secondary object slides up on the screen, and then resume playback of the main timeline once my object slides out of view. Here's my current code: <script> var tl = new TimelineLite(); tl.add( TweenLite.to("#studyDescription", 1, {top:20})); tl.to("bgMask", .5, {autoAlpha:1}); tl.pause(); var button = document.getElementById("openButton"); button.onclick = slideStudyUp; if (button.captureEvents) button.captureEvents(Event.CLICK); function slideStudyUp(){ tl.play(); } var closeButton = document.getElementById("closeButton"); closeButton.onclick = slideStudyDown; if (closeButton.captureEvents) closeButton.captureEvents(Event.CLICK); function slideStudyDown(){ tl.reverse(); } </script> I'm pretty sure that I just need to add something like "main timeline.pause()" to my slideStudyUp function, and "main timeline.play()" to my slideStudyDown function - but what's the correct way to reference the main timeline? Thanks!