Jump to content
GreenSock

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

Search the Community

Showing results for tags 'label'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

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

Product Groups

  • Club GreenSock
  • TransformManager
  • Supercharge

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Personal Website


Twitter


CodePen


Company Website


Location


Interests

  1. Hey everyone, I've not had to give too much thought in the past to how I structure timelines, but I think it's going to be important on an upcoming project so would like some advice on how to tackle it. The animation is broken in to three steps, it should play but loop at the end of each step (almost in a passive state) until the user chooses to proceed to the next step. The user can also choose to play one of the three steps of the animation via navigation / buttons. All elements of the animation exist within a single provided SVG. Each scene will need to d
  2. Hi there, I'm trying to achieve some quite simple animations for my bootstrap carousel slides, but I'm not able to get them rendered at the right moment. What I want to do, is to animate the slides, which are inside its captions, for each slider image when the next image is sliding/ fading into view. Right now, the carousel is set to "pause", so that the slide effect is managed via the carousel indicators or controls. I got to work the animations for the first carousel image with a simple timeline, like so: var tl = new TimelineLite(); tl.from(".tlt", 0.5, { left: 200, autoAlpha
  3. I have an element that is by default set to opacity:0 and then first set to 0.5 and then to 1 via GSAP. When I use a label for the timing the element is not reset to 0 but to a random (?) number somewhere between 0.3 and 0.5. Does restart() not reset all parameters? Thanks!
  4. ajando

    Loop certain area

    Hi Im relativ new to gsap and im also not that big of a JS geek, so I'm trying to fiddle my stuff with the forums and the documentaries. But now i got kind of stuck... Im trying to draw those rings (see demo) and afterwards let them do this wave thingy. After that, it should repeat at .addLabel('start') I tried the seek(); staggerFromTo(); and other stuff (e.g. http://jsfiddle.net/geekambassador/eMGsc/), but it might be also a small syntaxerror? Maybe someone can help me Greetings
  5. Hi, Is it possible to create a timeline that after playing for the first time, when it repeats it starts from a different point in the timeline? In the example below (CodePen included) I'd like the timeline to play through once from the start, and then after this when the repeat kicks in I'd like it to start from the "start" label. It will basically remove the initial fading in off all the elements after the first play. var tl1 = new TimelineMax({repeat: -1}); tl1 .to(".box", 2, {opacity: 1}) .add("start") // would like animation to st
  6. Hi Gsap'ers. Is there a way to go to a label other than just jumping? Example: When clicking the button it goes from the current point of the timeline to the label, but keeping the tweens in sequence.
  7. Hello, First time posting here, but already learned a lot of great things on this forum. Thank you community! I am having a problem with playing timeline from a certain point (label). I have one master timeline, which is holding a lot of smaller timelines, functions etc. And I have main navigation (regular buttons), that should control navigating through the main (master) timeline. const master = new TimelineMax(); master.add( preload ) .add( audio_togle, '+=13' ) .add( particles ) .add( navigation_show ) .add( videoSi
  8. First of all sorry for not posting codepen URL, for some reason, my code isn't executing on codepen. Below is the TimelineMax code I prepared for the kind of animation I need. tl .to(panel1, 0.3, {width:'50%',ease:Power3.easeOut}) .to(panel2, 0.3, {left:'50%', ease:Power4.easeOut},panel1) .to(panel2, 0.3, {height:'50vh',width:'25%', ease:Power1.easeOut}) .to(panel5, 0.3, {width:'25%',height:'50vh',left:'75%'},panel2) .to(panel3, 0.3, {top:'50%'},panel2) .to(panel3, 0.3, {width:'25%',height:'50vh'}) .to(panel4, 0.3,{left:'75%',wi
  9. Hi, I'm spinning a three faced pyramid object using rotateY. I've set up a TimelineMax consisting of three tweens with labels correspoding to points where each face of the pyramid is fully in front of the user. When the pyramid is hovered on, I'd like to tween to the nearest label, such as to reveal the nearest "face" of the pyramid completely. On the codePen, I'm using the "currentLabel()" method which tweens the rotation to the "previous" label successfully. However, if a tween is past it's "midpoint", I'd like to tween to the next label, which is "close
  10. Hello, I'm trying to use the method seek() to jump to a label in a nested timeline. The real example is a bit complex to reproduce in a codepen so I constructed a useless one just to show the issue. Baically I have a series of small animation contained in a another animation. This animation (the external one) has a duration equal to all the small animations inside. I would like to be able to jump to each of these animations, but apparently I can't. I'm sure there's a good reason for this, but is there any way to achieve what I'm trying to do?
  11. I am using https://github.com/scottschiller/SoundManager2/ to play sounds in timeline. I am trying to launch "empty" animation with sounds execution using labels. So i would be able to define sound once, and then just repeat it with other animation in the future. Sound in codepen shoud play 3 times but it plays only once. What's wrong?
  12. Hello, I'm expanding on a pen I already posted a couple of days ago, and trying to figure out ways to write a cleaner timeline. The whole thing will be a sequence of images, or slides, always fading to the next. In the example there are 3, but they might as well be 100. For the basic behaviour, fading in and out, I have this: $.each($('.slide'), function(i) { tl.add([ TweenMax.to($('.slide-' + (i+1)), 1, { opacity: 0, immediateRender: false }), TweenMax.to($('.slide-' + (i+2)), 1, { opacity: 1, immediateRender:
  13. Helo guys, I need some help with a little issue that is driving me crazy. In the codepen I have attached I am trying to animate three balls each one with it's own timeline and I have an animation handler that depending on the stage on which the app is it will move the animation point to one point or another of the timelines using labels. The animation when moving from the loop and seeking the 'animationOut' point should move to the top and out but keeps looping inside the 'loop' label step. The seek function (lines 75, 80, 85, 91, 96) seems to not be working correctly. I am u
  14. Hello I have a simple timeline set up with 6 steps, no nested timeline or anything, and each step has a label. At the moment I can tween to and from labels (while watching the animation play out in either direction) by using tweenFromTo. The problem with that is some steps are quite long, and I'd like to go from one step to another in a defined duration. Is this possible? For example, can I tweenFromTo label1 to label3 within X amount of seconds? The closest thing I have come across is setting a timescale to a high number, but that's not really a solution and it'll be inconsist
  15. Hi, I have a pageless site that I'm working on, that has a slightly unusual navigation/ flow. I've got it working almost as it's supposed to. There's two main ways for a visitor to navigate the site. Note: the pages/sections are not presented in a linear fashion. 1. By scrolling they will move on to the next "page" or section. 2. Through the navigation menu they will go directly to the section The issue I am having is can't quite figure out how to make the whole thing loop continuously. When they get to page 9 and they continue to mouse, I'm trying to get it so they just go
  16. Trying to create a floating orb effect where each orb bubbles in and then sends a transmission to the child's brain. Each orb will send a transmission at different times, but avoid being close w/one another in terms of the actual transmission sequence. At some point during the entire animation the orbs that send the signal in diff. intervals eventually sync up. What would be the best way to control the transmissions from overlapping one another? BTW it is required that each orb float all the time even when another adjacent orb is transmitting.
  17. Hi . This is my first time using GSAP. For a pretty simple task, in theory. I' using two timelines, with 2 phases. In each timeline, I animate the width. In the first phase, with a time «stime», While the first timeline is decreasing his width, the second, grows. In the second phase, with a time «btime», the first timeline increases his width, while the second, decreases. Well, there are two timelines, where they first grow in a direction, and later, they grow in the opposite direction, changing the time. I have a pair of buttons, «+» and «-», where we can change the time used in e
  18. Hi! I have a timeline animation which I would like to reverse, without reversing the last two tweens. In my jsfiddle example http://jsfiddle.net/identitoe/oLpvfqm4/2/ I would like to keep the last two tweens, the margin-top and the background-color and start reversing from the point I added the label. I just don' get it to work. Thank you
  19. Greetings, Is there a method to fire a function when a label is reached in a timeline? Thank you, Steven P
  20. Dear GSAP and fellow GSAP users. Although I found a workaround, as I expand my usage of your api, I thought it might be useful for me, and maybe others, to create a discussion based on what I encountered I've added a codepen as this is good practice, but it's a completely stripped down version of what is actually happening, as it is not possible to include everything, and what I'm after, seems to me to be something fairly straight forward. Scenario I have a timeline (small snippet in codepen) that simply animates some text, but which includes calls (removed from codepen) to ext
  21. Hello! I posted once before about a similar problem, and I was able to workaround that problem easily, but this one is a tad different. In the codepen sample I provided, there are 6 color blocks. Each one is animated in its own timeline, and each timeline is then nested in a master timeline. In this master timeline, I set up a pause at the end of each nested timeline, so that playing the timeline only plays one scene (or, in this example, one animation) at a time, then pauses and waits for the user to press "continue". It is also paused at the start, so you must press "continue" to
  22. Hi, Maybe I did smthng terribly wrong, but I think I found an issue in GSAP 1.14.2. play('label1') doesn't work correctly. If I use the GSAP version: beta 1.8.2 it does. Thank you! Grtz Dennis
  23. Does anyone know if it's possible to assign a label to a sequence when that sequence is already relative to another label? for instance: tl.to("#redBox", 1, {x:550}, "start") .to("#blueBox", 1, {x:550}, "start+=0.05", "second") .to("#greenBox", 1 {x:550}, "second+=1"); You can see the codepen here http://codepen.io/anon/pen/vLtlg But from this snippit you see that the bluebox starts relative to start, and I want greenbox to start relative to bluebox. Is this possible?
  24. Greetings one and all. Hopefully Christmas brought your family together. Thank you in advance. I have a need to update a dynamic text box when a new label is reached. The animation is a sequence of lines drawn, points reached and then the point animated, and an image faded. This all works quite nicely - Jack, your packages are _amazing_!! What I would like to do is as best I can explain: as each label is reached, a dynamic text box is updated with new text. On each new label created, would an "onStart" be apropos? And ... how would I populate the box? I've built dynamic text boxes
  25. I'm using TimelineMax to create an animation. I add tweens to it with, for example, the to-method. I know it's possible to set a label to a tween on the same line as adding it to the timeline like this: tlMain.to(sky, 2, { alpha: 1}, 'skyIn') ...and how to timeoffset a tween in the timeline by using [label]+=[value] or [label]-=[value]: tlMain // MOVE IN SKY + SNOW 0 .to(sky, 2, { alpha: 1}, 'skyIn') // fade-in sky .to(snow[0], 2, { alpha: 1}, 'skyIn+=0.5'); // fade-in snow 0.5 seconds after moving in the sky But what I would like to archive is: - add tw
×