Jump to content


  • Posts

  • Joined

  • Last visited

Posts posted by anotheruser

  1. Hi


    I know there is a way to seek gsap timeline using

    t1.play(time, suppressValue)


    so if i set the suppressValue to false , all the previous events(add callback, onstart, oncomplete) will be called right ?


    Is there a way to enable onComplete events alone without enable all the events? 

  2. Hi this is a new question


    lets consider that i have a timeline t1


    the total duration is of the timeline t1 is 8 and but i want that to repeat once , but the total time should not exceed 12 seconds


    so basically the first loop will be a normal animation and the second one would be a part of it

  3. Hi


    I have a timeline with two tweens

    the two tweens are 8 seconds each and repeat is set to be -1 so that it is infinite


    so the timeline's whole time is now showing as infinite . 

    I want to set the timeline time to a specific amount without actually changing the timescale


    timeline.set({}, {}, time); will work , it works only if the time is greater not lesser. how to actually achieve this?

  4. On 3/15/2018 at 12:00 PM, GreenSock said:


    Yep. It's a LOT more complex than you might imagine due to performance optimizations and the flow of code. But I'll spend some more time looking for a way to make it happen (no promises). You can definitely work around it, even in your second example. Here I use an "indexify()" function to which you feed in the elements and the modifiers object and it'll do all that work for you automagically...


    var elements = [
      ".stage h1",
      ".slider .slide span"
    TweenMax.to(elements, 1, { x: 50, modifiers: indexify(elements, {
          x: function(value, target, index) {
            console.log(index, target);
    function indexify(elements, vars) {
        var a = [].slice.call(document.querySelectorAll(typeof(elements) === "string" ? elements : elements.join(", "))),
            wrap = function(func) {
                return function(value, target) {
                    func(value, target, a.indexOf(target));
        for (p in vars) {
            vars[p] = wrap(vars[p]);
        if (vars.scale) { //scale is an alias for scaleX and scaleY
            vars.scaleX = vars.scaleY = vars.scale;
            delete vars.scale;
        return vars;


    Obviously that indexify() function could be reused as much as you want.


    Does that help?



    Tried this, Didnt work

  5. Hi


    Is it possible to control a html video tag's playback using GSAP


    Right now what am doing is using GSAP's callback function to start two/three videos 


    But is it possible to pause the video when the timeline is paused as well

  6. Hi I have created a tween using custom easeas following


    TweenLite.to(graph, 2.5, { ease: CustomEase.create("custom", "M0,0,C0.126,0.382,0.282,0.674,0.44,0.822,0.632,1.002,0.818,1.001,1,1"), y: -500 });


    The above tween is added to a timeline

    As it is mentioned in  the docs that we have to create the custom ease on beginning of each webpage load, I want to clear/destroy the customease now , 
    I have killed the tween and profiled the webpage in chrome but still seeing that the custom ease is not being removed.


    is there a function like


    customease.clear() there to do this thing ?

  7. Also as you have stated in the following comment



    I have tried to set a dummy value to a tweenmax like TweenMax.set("#dom", {opacity:"0"}) But CSSPLUGIN still hold reference of the old SVG DOM. 


    Also do i have to set a dummy tween normally or do i have to set a dummy tween for all the timelines like this

    t1.add(TweenMax.set("#dom", {opacity:"0"}))

    t2.add(TweenMax.set("#dom", {opacity:"0"})) ?

  8. I have a master timeline and a number of children timelines which is added to the master timeline through .add() method. I have killed all the timelines but still GSAP CSSPlugin holds some reference just like the image which i have added to this post. Is there anything I am doing wrong ?


    • Like 1
  9. Hi,


    I am using GSAP in a react application, I have a timeline in my redux store and the timeline's onupdate listener in a component. I am using the onupdate to move a playhead thumb just like a Player. Every time the onupdate is called i get the value from the timeline._time and change the value for the thumb, the problem is when huge tween is happening (like for 200 items) the onupdate calls are not frequent , but the tween runs very smoothly , is there anyway i can get smoother progress values?

  10. 9 hours ago, GreenSock said:

    Sorry, I totally forgot that I had built in a special option for this - just set reduceWhiteSpace:false. :)

    I thought i clearly read the documentation , I am wrong , thanks man , Awesome answer as always 


    BTW is that already present in the document? or added recently?

  11. 11 hours ago, GreenSock said:

    Or just a simple <span> with a margin, like:

    <div id="blueBox">hi<span style="margin-left:5em"></span>greensock</div>


    The problem is i am trying to do a typewrite effect when using the thing like you said , the cursor will consider it like a whole div rather than seperate div

  12. Hi , I am trying to create a typewriter effect , but what i am facing is a issue where when i try to split text with 'chars' it automatically remove spaces and make it as one space for eg if i type "hi                                 greensock" , it changes it to "hi greensock" please check the following codepen, I need spaces to be in separate div because I need to get the cursor placed inside the seperate div


    See the Pen BxbOZq by jeffin417 (@jeffin417) on CodePen


    See the Pen aGMaJZ?editors=1010 by jeffin417 (@jeffin417) on CodePen