Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

Search the Community

Showing results for tags 'kill'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager
  • Supercharge


There are no results to display.

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Personal Website



Company Website



Found 23 results

  1. Hey, step by step, I figure out, how this fantastic plugin works, but there is one thing, I'm not understanding: The goal is, to make two different instances, which means, when the viewport is wider than 992px, it should load the instance for big screens. When it comes to smaller viewports (on resize), it should kill the actual instance and init a new one for smaller Screens. And that works perfectly with kill(), clearProps and then new init. But it works only on resize, when my scroll position is within the start and endpoint of the first screen instance (isActive).
  2. hi guys how i can kill all current animation from target objet ? Related to doc , am not sure am understand. i get `TypeError: TweenLite.kill is not a function` so here the example what am target. Hold click will power Shake the hud. But if release click befor i click shakes animations, i want kills. So here my experiment When downClick pointerDW(e) { TweenLite.to(this.sprites.c2.scale, 0.2, { x: 3, y: 3, ease: Back.easeOut.config(1.7) }); this.sprites.c2.alpha = 0 TweenLite.to(this.sprites.c2, 1.3, { alpha: 1,rotation:Math.PI, ease: Po
  3. Hi. This is probebly an easy one, but I need some one to point me in the right direction here. I can't get .isActive() and .kill() to work on my TimelineMax (or don't understand how it works). I have search the forum and tried some examples but still no luck. I want to create a simple feedback animation for the user when click on a save button. If the user clicks several times while the animation is running, I want it to kill the active one and start a new one. Does not sound that hard, but now it just create an other feedback message beside the existing one.
  4. Hi, this is my first forum post and I'm hoping to get some help with an issue and learn more about GSAP. The project I'm working on is replicating a video game character select screen where the user can navigate through 3 characters (using the left and right arrow keys) which have idle animations until selected where an active animation will play on the selected character. I am doing this by using sprite sheets and SteppedEase in TweenMax. I have the navigation and idle and active animations on document ready working. The problem I am having is when switching to the nex
  5. I have this tween that repeats infinitely: var sparkleblink = TweenMax.staggerTo(".confetti", .5, {ease:Linear.easeNone, opacity:.2, repeat:-1}, .01); but I want to stop this animation after a certain point. I have a TimelineLite() which calls a function after the last animation: var tothebox = new TimelineLite(); tothebox.to(".scrollnotif", .1, {opacity:0}) // ** other animations here** // .to(".scrollnotif", .1, {opacity:1, onComplete:killthis}); Then I have that function that's being called onComplete: function killthis(
  6. Hello ! Dear guys, I have a problem. My program works llike: I have one animation and when I click on e.g. 'Button1' my animation will change, and second animation will start (in infinite loop like the first). I created an object with coordinates of my polygon points. I start with points[0]. When I click on button1 named 'Warsaw' my function gets current position of each verticles and paste it into new object with coordinates because I want a smooth transition between my animations. So I think: Aha! I kill my old animation, create short new animation (with transition from current
  7. I'm a newbie to Web Development and in the process of learning if GSAP can fill my animation needs. I am pretty sure it can. This is my second post. In my first post, I mention I am currently taking an E-course and I am in the middle of creating a javascript reaction tester application: http://codepen.io/KerryRuddock/pen/rLJPkq To view the codepen correctly, please change the View to Full Page. Click Start. A random sized and colored ball rotates around the screen based on a set of CSS keyframes: twirl This codepen is HTML, CSS and JS only, no GSAP just yet. The code is
  8. Hello everyone, I am currently creating a page that uses the GreenSock animation library to trigger animations as a user scrolls down the page. The interesting kink in this is that I need to swap out timelines I have created for the sake of responsive design (ie the animation graphics change to less complex ones when the page gets smaller.) This is a simplified test case from my actual page, but gets the same point across. The primary issue I am having is with using .pause() and instantiation of a new TimelineMax() that uses the same elements. For example, if I create a timeline with a Twe
  9. Hi everyone, my situation is this: I have two timelines, one for the loading initial animation and another one for the coreography when the page is loaded. The animation of the loader (a spinner) is made more or less the same as the codepen linked but in this way, as you can see, the rotation doesn't stop properly. (In simple words i want to pause the rotation animation WHEN the page is loaded, but I doesn't want to stop that if it's still moving) tlTimeline .to(test, 1, {rotation: "+=90", repeat: -1, repeatDelay: 1, onRepeat: loaded}); function loaded(){ tlTimeline.pause()
  10. How do I kill tweens past a certain point in time? So, I have a timeline with a bunch of tweens all starting at random times. I want to remove tweens of certain elements that either start past a certain point in time, say, 5 seconds, or tween beyond that point in time. I know about killTweensOf(), but now how do I killTweensPastTime()? I searched google and these forums but couldn't find anything. Thanks, John
  11. Hi everyone. I set a infinite timeline with some callbacks onComplete & onRepeat that change numbers around the page. I'm working into an ember application, so because of my timeline is infinite and change numbers in the page I need to kill everything when the user leave the page to another, otherwise when he will come back the new timeline initialization will mess-up the design. I tried with the function mytimeline.kill() but looks like it doesn't work. Any idea on how to solve? Cheers! ps: it's difficult to provide a codepen in this case sorry
  12. I'm trying to kill a tween after it plays- mainly because the <div> flies off the page- but it's still there, as you can scroll to the right and it is still there. I would like both divs to disappear after animating through the timeline. I know there is a "clear()" as well, or maybe I should be using "clearProps" Thanks
  13. Hi all. I have a problem with pausing a point of TimeLineMax. I have an animation queue like this: var tl= new TimelineMax({paused:true}); var tm1=tl.set(".circle-f:nth-child(7)", {autoAlpha:0,scale:0,backgroundColor:'#00E5FF'}) .addLabel("mystart") .to(".circle-f:nth-child(7)", 0.3, {autoAlpha:1,scale:0.2,backgroundColor:'#00E5FF'}) .addLabel("mystop") .to(".circle-f:nth-child(7)", 0.3, {scale:1,backgroundColor:'transparent'}) .... The problem is when I want to reverse timeline from "mystop" to "mystart". I do it easily by : if(//for example: scrollTo<=500) tm1.tweenFromTo("myst
  14. I have multiple elements that are being used as the trigger under one class. For example, the "dragHandle" class is my trigger: <div class="dragHandle"></div> <div class="dragHandle"></div> <div class="dragHandle"></div> <div id="draggableLayer"></div> This is fine when it is first initialized. All three will drag the "draggableLayer." The problem is, I am dynamically adding more "dragHandle" elements, and they are not seen as triggers after Draggable has initialized on page load. I.e: <div class="dragHandle"></div>
  15. lokis

    Killing problem.

    Hi, I have big problem with killing The problem: 1. I have 5 functions fired one by one with "onComplete". 2. I need to kill any tweens from this functions in any time, and it works properly when I kill any of these functions for the first time. 3. It doesn't work properly when I fired these functions and try too kill one again. 4. It does look like "the killing machine" remember position of myElement when the first "kill" was fired and move in a blink myElement to this position, then of course kill the tween. Should I clear something or maybe something else? Best Regards
  16. function mouseOUT(e:MouseEvent):void{ TweenMax.to(menu_MAIN, 2, {rotation:"360", ease:Linear.easeNone, repeat:-1}); } function mouseOVER(e:MouseEvent):void{ TweenMax.killTweensOf(menu_MAIN);; } Hi guys, here is a little problem I have and cant figure out how to solve it say I have a clock hand @ 12 o'clock which rotates constantly until I MOUSE_OVER it, what I am trying to do is when I MOUSE_OVER it I want the clock hand to always stop @ 12 o'clock no mater when I MOUSE_OVER it. Thanks for your help in advance Steven
  17. I have the following situation: I have one timeline. I append to it a sequance of TweenLites with target1. A little later i kill tweens of target1, and try to launched a sequance of tweens for target2. The problem: animation for target2 is not launched, it's only works when i call timeline.kill() instead of timeline.killTweenOf(target1) I hoped to use a single instance of TimelineLite to handle all needed animations. i.e. I want to use timeline.append, timeline.insert for many targets, and if the target is repeated or i just needed to get rid of tweens, 1stly kill it's animation and run n
  18. I am trying to build my own custom rotator, but I am having a problem with interrupting the current animation, then going to a specific one to play from there. I made a click function that plays from the desired spots, but I have tried several ways to interrupt the current animation. disc01.onclick = TweenMax.killAll(); animate_rot01; disc02.onclick = TweenMax.killAll(); animate_rot02; disc03.onclick = TweenMax.killAll(); animate_rot03; disc04.onclick = TweenMax.killAll(); animate_rot04; disc05.onclick = TweenMax.killAll(); animate_rot05; Here is the link to my codepen http://cdpn.io/IKvah
  19. jlo

    Responsive Animations

    Hi Greensock guys, Know this topic has been covered a little in some other posts, was reading about using media queries and 'resize' functions here and here, but I wanted to double-check something with you in regards to responsive animations. I've just put together a quick landing page for my portfolio, found here (and big thanks to the GS guys for helping me nut out questions I had along the way with it), and I'm using an if/else statement after the $(document).ready to fire differently scaled animations depending on the browser width. I had put in a window resize event handler in my
  20. Hello all... i had a couple questions about clear and kill methods: What is the difference between using clear(), versus one of the kill methods and/or clearProps? Is the clear() method faster, and just clears a timeline? ...versus using one of the kill methods, or clearProps on a individual basis? Also is clear() better than using killAll()? thanks ahead of time for any clarification?
  21. Gabriel

    kill vs clear

    Could someone explain the difference between using kill() or clear() on a timeline? That is, besides kill() being able to kill individual tweens, lets assume we're using kill() on the entire timeline itself. The documentation is unclear (use kill to kill a tween; define kill?). If they're the same, then why use clear(), other than the timeline instance being preserved? And, I'm interested if either resets the positions of elements in a timeline to their beginning position, or what the best way to go about that is? Thanks!
  22. I have a DOM element that stores a TimelineLite Object in a data object. I reference this stored TimelineLite Object at a given time and call the kill() method on this object. From what I understand and desire, the kill() method will immediately stop the animations on the TimelineLite Object and release for garbage collection. I have several tweens and potentially timelines nested in the referred TimelineLite Object. I want them all to stop immediately even if currently tweening. They should stop right where they are. This is not what I am experiencing. Currently tweening animation
  23. Hello, Here's the scenario: I create e-Learning and in the past I have used simple jQuery to show and hide divs when buttons are clicked. I'm still doing this, but I'm now using TweenMax to add some nice animation. My problem is that if you click the buttons quickly in turn I get an animation build up. I would like only the last animation to finish, before the last button click animation starts. I've tried using Overwrite, but nothing seems to effect it. You may ask "But why would a user go click happy on the buttons?". But that just what some people do. Here's my jQuery a