Jump to content
GreenSock

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

Search the Community

Showing results for tags 'tweenmax'.

  • 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. In the following code, the first function works. However, the second function throws an error. tl = TweenMax ; $("#run").click(function(el) { var el = $(".box") ; tl.to( el , 2, { left: 10 } ) ; console.debug( "done" ); }) ; $("#reset").click(function (){ tl.reverse() ; console.debug( "reverse done" ); }); If I replace 'reverse()' with 'pause()' or 'reset()', I get similar looking errors: Uncaught TypeError: Object function (t,e,s){i.call(this,t,e,s),this._cycle=0,this._yoyo=this.vars.yoyo===!0,this._repeat=this.vars.repeat||0,t
  2. 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
  3. Hi all, I'm trying to animate an SVG <line> and a <circle> which are both dashed. What I need is the dashes to be shown one-by-one (staggered, I guess ) to make the line "drawn". I've tried animating the strokeDasharray like so (where "secondStepDashedLine" is the <line> element) which didn't do anything really: tlInitial.staggerFrom(secondStepDashedLine, 1, { strokeDasharray: 0 }, 1.5); Is there any way of doing this? Thanks in advance.
  4. TL;DR I upgraded our project to use 1.19.0 after using 1.18.2 and requirejs couldn't find TweenLite unless I defined it explicitly in the require config paths object. Is it the expected behavior? We do amd with requirejs. My GSAP section in the paths object looks like this (there is also a base url defined of our external libs server): paths: { // ... TweenMax: {min: serviceURL('tweenmax/1.19.0/minified/TweenMax.min'), source: serviceURL('tweenmax/1.19.0/uncompressed/TweenMax')}, TimelineMax: {min: serviceURL('tweenmax/1.19.0/minified/TweenMa
  5. Is there a shorthand to jump to the end of a TimelineMax (Actually jump to starting point because timeline is running in reverse mode) instance (and fire all of its onComplete listeners) when TimelineMax running in reverse mode ???
  6. I am using TweenMax for some animations. The animations work fine in Chrome, but Safari and Firefox both have issues with the center animation. I though GSAP removed those browser issues, so I am thinking I must be doing something wrong. Any help would be appreciated. Thanks!
  7. Hi All, I am trying to achieve a blinking eye effect. Ideally, I would like the eye to travel down from the top to half in the eye, this would simulate the eyelid moving down the eye to meet the other eyelid. I have tried scale with transformOrigin to achieve the effect as well as opacity 0. Opacity 0 seems to give the best effect, but the visible fade doesn't look too great. Would I need to use SVGmorph to achieve this? Can anyone point me in the right direction? My codepen attached shows the example. Thanks, Tom
  8. Hello! Is there any way that I could manipulate the duration of each tween in a staggerTo() function? Thanks!
  9. Hello GreenSock Masters! I want to collect and recognized all the plugins out there! If you have unofficial plugin for GSAP please comment it or reply it to this forum thread. My Unofficial Plugin for GSAP https://github.com/WarenGonzaga/AnimateCSSPlugin This is not actually plugin built because I rely on GSAP ease animations and some GSAP related variables. Anyway if you have something to share with go ahead and comment it/reply it! Thanks GreenSock Forum
  10. Hi guys I have a weird situation and I cannot explain what is happening Super simple, I basically create a div and set it to have rounded corners. Then set the overflow to hidden. Next I pop an image inside and all I want it to do is rotate inside, but it's glitchy. With the codepen URL for example you can see (while animating) the div temporarily looses it's overflow hidden the and hand is revealed on top. With our website: http://iplabs.com.au/amaysim/history-of-the-mobile-phone/ you can see it sitting there on top of the circle. Removing TweenMax instantly fixes the i
  11. Hey guys please please help to understand THIS on javascript. I am trying to use THIS to select the same selector from parent function. Here's example: function Animate() { console.log("Clicked!"); TweenMax.to("#thing", 1, {onStart: a}); } function a() { console.log("Yeah!"); TweenMax.to(this, 1, {y: "100px"}); } I know this is clever but I want to know how to select the same selector from parent function. Same as THIS.
  12. Hi, Very simply, I'm looking at this pen - http://codepen.io/chrisgannon/pen/pbzEYr. I want to have a button that moves the dot to predefined point on the path and then stops. TIA
  13. I am wondering if Greensock is able to tween an API from a different library? I am using Framer.js with my mobile work but using the GSAP animation library. In Framer you can tween the x value (relative), or the screenFrame x value (absolute value). I have attached an image for the API. https://framerjs.com/docs/#layer.layer (under screenFrame) The screenFrame API: element.screenFrame = { x: 400 }; Instead of tweening the x value which is relative, I am trying to tween the screen frame absolute value. TweenMax.to(element, 1, {x: 0}); TweenMax.to(element, 1, {screenFrame
  14. Hi, I'm having an issue using TimelineMax with a loop repeat. The animation works fine but sometimes there's some sort of "flashing" in the animation. It looks like the div inside is repositioned for a millisecond in the wrong place. I cannot understand why this happens and why it happens randomly. I linked a Codepen working example. Any ideas? Thanks!
  15. Hi there, What I want to do is have a tween that moves 250px right, has a Power3.easeIn and a Back.easeOut. I can animate the Power3.easeIn fine but how to do get the Back.easeOut. at the end of this movement?? Power3.easeIn line of code: TweenMax.to( $( '.mybox' ), 2, { right: 250, ease:Power3.easeIn}, 2); Im sure its not too hard but I cant seem to work it out. Thanks in advance.
  16. I'm trying to come up with a "better" way to write these morphSVG animations. The issue is that I have about 100+ paths I want to animated all at once. Everything works fine but I'm assuming there must be a more efficient way to do this, maybe with some sort of loop and an array? Then a function that gets called each time it loops? As of right now my project has like 2000 lines of JavaScript and I'm not even finished! In the codepenn you will find a small example with six different elements I'm morphing at the same trigger point. Thanks in advance and have a great day everyone!
  17. HI! I want to convert timeline lite elements with their animations into canvas animation, I mean the whole dom element and its children that contains timeline lite animations. an animation like this one http://codepen.io/ihatetomatoes/pen/QboVVV is there way to do that? I've found some libraries that only take a screen shot of the page but no animations.
  18. Hi, Is there a better way to do this? I want to load about 15 different videos all up for a portfolio type site. Any help is appreciated. Thanks, Phil
  19. Hey there! First time poster here, just got my membership and I'd love to get some help on an animation I'm trying to merge with scrollmagic! I made this little SVG animation of a tree growing using TweenMax and it worked out pretty well. Now I'm trying to integrate it with scrollmagic and I'm having a hard time figuring out what's wrong in the process. I have the 8 different stages (paths) and I wanted them to occur based on scroll position. I have a simple codepenn linked and if anyone could check it out and give me some pointers on what's missing or what needs to be change
  20. I'm half afraid to suggest this because it probably exists and it just didn't read the docs close enough, but I think it'd be really useful to have an overwrite mode that checks the assigned value of a tweened property, and doesn't overwrite if the value of one tween matches the value of another conflicting tween. For example, if you have 1 sec tween to Y position "10", and during that tween you call another 1 sec tween, also to Y position "10", the second tween could be ignored with this proposed overwrite mode. Could be useful when multiple UI elements effect the same targets and you don't w
  21. mp1985

    straggerfrom issue

    hi, I made ​​an animation with the fingers of the characters , as you can see from my codepen . I used TweenMax.staggerFrom so you can move each finger with a small delay . but I have a problem, how can I say that the animation should begin from the beginning all together ? Now the animation starts from an hand per time , but I would to say that all the hands they need to start the animation of the fingers at the same time , without any delay. maybe it is better don't use staggerFrom for my scope? any help, suggestion or advice? many thanks
  22. Hi All, I need some help to use Waving 3d shaded flag example. I want to filp left flag and bezier animation direction. Anybody can help me? Thanks in advance.
  23. I have this issue where I'm tweening a solid element and while the tween is animation there's a weird white line on the right bottom of the element. Once the Tween is complete the white border disappears. The weird part is that it's only visible on safari (mobile and desktop). Please see the code pen for simplified example. PLEASE HELP!!!
  24. My son needed a way to record the data his weather station collected. This is the start of the interface I wrote for him. http://codepen.io/dotComb/pen/Gqdydw Hope this helps someone! -Dan
  25. Hey folks, This is my first every question on the forum, so I hope to get some answers from some of you who are veterans and much more expert than I am. I've been using Greensock recently, specifically the TweenMax version. I have to say, GREENSOCK IS AMAZING! On to my question, this will be quick and should be fairly simple to answer, so here goes: How do I get an object to rotate in place after a button it is clicked, and then get it to reset and get ready to rotate again before the button is clicked again? I would really appreciate some help on this
×