Jump to content
GreenSock

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

Search the Community

Showing results for tags 'overlap'.

  • 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

Found 9 results

  1. Hi guys, I built a page with multiple animations using GSAP and ScrollTrigger, this is the page Open Screenplay. The animations are very good but I need to add transitions between the sections but I don't how I can do it. The transitions that I need to apply are bounce transition like this https://connect-homes.com/process and overlap transition like this http://www.espn.com/espn/eticket/story?page=Dock-Ellis. Thanks in advance.
  2. Long time user and a big fan of GSAP Usually I can figure out issues on my own, but this time I'm really stuck. If you refresh the Codepen, you can see that the first animation is the text zooming in slowly, and then zooming out quickly after a brief delay. Now after all the animation is done, I added a tl.restart(); so that it will go back to the start and replays everything, but this doesn't seem to be the case. The text animation is now only appearing instead of the whole zooming in etc. Where did I go wrong??? o.O
  3. I have taken the Codepen for "Draggable with "droppable" logic" (located here) and forked it and rewritten a lot of it to to get the effect i am looking for. basically, i do not want any draggable item to EVER overlap any any other draggable item. I spent a good part of the morning today searching the forum and reading up in the docs trying to think of some form of simple collision detection. The idea being to detect a collision and have a simple collision event that would make the divs bounce off of each other. that is not built in to gsap (should be!) and I have not found anyo
  4. Hi ! It's possible to achieve the scroll effect in this page (this page use scrollmagic and greensock.) http://www.locus-solus.it/en/pouffe_gae_aulenti The elements continue their animation after scroll is stopped. I dont know if I could achieve this with greensock tween settings or the scrollmagic one Thanks!
  5. Hey guys, I am totally new to GSAP (I just started using it last night), not to mention a junior developer in general. I want to animate some elements on a page to move accross the page and fade out, all with the same class. The part I am confused about though, is that in order for the elements to move they must be given a position property of absolute or fixed. (At least that's what the greensock tutorial said I had to do). When I apply this position property to the elements with the class I want to animate, they all stack on top of each other in the same place. How do I keep
  6. Hello Again The following works nicely var tl = new TimelineLite(); var $frame1 = document.getElementById('frame1'); var $txt1 = document.getElementById('txt1'); var $txt2 = document.getElementById('txt2'); tl.set($txt2, {opacity:0}) tl.add( TweenLite.to($frame1, 1, {alpha:1}) ); tl.add( TweenLite.to($frame1, 1, {backgroundColor:"#ff6a6a"}) ); tl.add( TweenLite.to($txt1,1,{scaleY:0, ease:Elastic.easeOut},2) ); tl.add( TweenLite.to($txt1,1,{alpha:0, ease:Elastic.easeOut}) ); tl.add( TweenLite.to($txt2, 1, {alpha:1}),"-=2" ); tl.play(); It works: my last timelinelite addition h
  7. I have three timelines, playButtonAppear, playButtonPulse, and playButtonDisappear. Basically, the appear and disappear ones will always overlap the basic pulse state, so the goal is to smoothly transition between the pulse's bounce, and the animation of the appear or disappear. To control this, there is an offset where one meets the other, and fiddling with it helps to dial in to make sure the overlapping items are in sync. This is all great, but I'm noticing that the values I set (even when absolute as opposed to += or -=) are not the actual values being used. For instance, if s
  8. Hi, firstly - many thanks for great GSAP suite. I'm using it for first time and that's really easy to set up. I have just one question about restart the animation/timeline. I have 2 timelines and both animate different element and that's just fine. Animation is good and if you refresh the page everything looks correct. But if you click on Repeat button animation starts in 0.5 seconds so you can't see, that text is not coming to content (to specific position - from 0% to x%) but appears in content (apperas in x%). I noticed that it relates to overlapping ( 4th parametr in method to() ) if
  9. I have three tweens, each one with a sound effect called on start: //simplified code: TweenMax.to(this, 10, {alpha:1, delay:1, onStart:playSound1}); TweenMax.to(this, 10, {alpha:1, delay:2, onStart:playSound2}); TweenMax.to(this, 10, {alpha:1, delay:3, onStart:playSound3}); function playSound1():void { LoaderMax.getLoader("sound1").playSound(); } function playSound2():void { LoaderMax.getLoader("sound2").playSound(); } function playSound3():void { LoaderMax.getLoader("sound3").playSound(); } I would like the sounds to overlap, but instead, the first sound is cut off by the second, whi
×