Jump to content

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


  • Posts

  • Joined

  • Last visited

Recent Profile Visitors

456 profile views

Creek's Achievements

  1. YES!!!!! I still have no idea how to kill off endlessly repeating nested function timelines But I was able to replace the offending functions with simple nested timelines. Lost a bit of variance with ye olde variables but I'd accidentally stepped off into the "too advanced" section of javascript I even tried setting a variable I could send with the basic logic - if killX=1 then KILL YOURSELF!!!! But functions are obviously against the entire notion of suicide, so good on them for being so special! Again, thanks very much to everyone for all of your patience! And I absolutely promise to create demos in the future at least trying to replicate what I think might possibly be going wrong. Not intending to waste everyone's time even further with my idiocy
  2. Then what's the GSAP lingo for creating a loop within a timeline, as I'm "going for" here? ie Timeline has reached this point, now go back and repeat starting at "label". And guessing that would have a repeat parameter? And, if I'm testing a long animation - then - skip all this other junk and play starting at "label"? I'm guessing Play is just the wrong command? AWESOME!!! I totally didn't catch why that was tossing up errors. It's especially nice to be able to "exit" GSAP calls and do other stuff. I did try to reference it - but javascript relates that it doesn't exist? Here is the CodePen with console log working, but still unable to halt the function? https://codepen.io/tibbeecode/pen/wvqwOmy The following is just my attempt to explain WHY my animation is structured as it is and why I wish to kill off functions. If there is a way to KILL infinitely repeating functions, then please ignore? -------------------------- I understand I'm not supposed to ask "logic" questions - but hopefully it's okay that I relate MY logic, which is working fine - with the obviously MAJOR exception of the apparently non-killable functions with endless repeats? I'm animating a character with various expressions. Those are the expressions being added throughout the master timeline - like the color changes here in the aniColor function. While those expressions are continuing, there are "background" functions responsible for animating repeated body movements. It's a fish, floating in the water with his fins and whatnot moving about. Collectively those are all various versions of boxAni. However it is I managed to do it, I really like the way everything is working. I'm now just "tweaking" - dealing with what I view as weird "issues"? I can't loop the sequence of expressions, and I can't eventually END the repeated animations. In other words, I have the animation looking almost exactly as I want it to look. And it took me a VERY LONG TIME to figure out how to get it to work somewhat "seamlessly" together. But, at some point, the fish swims off. And all of that floating around animation, the various boxAnis? They are HIGHLY processor intensive. So - fish off the screen - but GSAP is still animating him and eating up the computer power. That's how I came up with the kill(). It works PERFECTLY on parts that are NOT functions. But the functions will not stop. I obviously don't know how to reference them. If it's a javascript thing - and I am not ALLOWED to reference them as functions? Then obviously I need to NOT ever use endlessly repeating functions ever again They NEVER end. I believe you're very politely telling me "You're doing it wrong." But, other than the stupid functions that won't STOP - however I did it wrong is otherwise working? And I don't know enough to disassemble all of it without horrible fear that I'm going to BREAK EVERYTHING that's currently working? My easiest path forward is to just try and REMOVE the bits where I screwed up and made any of the boxAnis into functions. Because, if they're NOT functions - then I'm allowed to kill them? As you related, they probably don't need to be functions anyway. When I initially created all of it, I obviously didn't know functions were so finicky? And I promise I don't know of a more succinct way of explaining that - without various fears of coming across as even possibly "unappreciative" or "not paying attention" or whatever - truly VERY SORRY that I keep erring on the side of "Well it's long-winded, but I'm doing my best to explain myself as best I know how to explain myself?"
  3. https://codepen.io/tibbeecode/pen/gOxYZpz No clue how to end infinite repeat of function, as noted in code comments. Labels also don't work, as noted in code comments. Included as possibly also related to using functions? And I at least think I now understand why attempting to be "conversational" - when asking for help is a horrible idea? Thanks again for everyone's patience. Also, very much hoping that - in attempting to isolate - the gurus understand that even *I* understand that there are much easier ways of accomplishing the simple animation. Just doing my best to demonstrate what isn't working?
  4. YES!!!!! That WORKS! Now that you've explained, I also actually understand WHY that works - believe it or not. Okay, well I think I do? BUT... why is it that in functions that contain timelines - it then doesn't work? It works perfectly for nestedAni which is a nested timeline - but no go for nestedFunctionAni with the timeline nestedFunctionTL? (I have nested timelines that are set up as functions being called with variables - in case I've miscommunicated?) .add(() => nestedFunctionAni.kill()) No go. And .add(() => nestedFunctionTL.kill()) also doesn't work - maybe because outside that function, its timeline can't be killed? But I thought maybe - .add((nestedFunctionAni) => nestedFunctionTL.kill()) Would properly direct the kill notice? And still nope. I also prefaced the right of the arrow with the this. bit, just in case? And still nada. No javascript errors, but the repeat doesn't end. Knowing HOW if possible to send the same information to functions would be awesome? (Oh and I'm completely wiped out for the day, passing out - so my master timeline is killing off my pestering function for the evening It's been on "repeat" far too long.)
  5. I don't understand what's going wrong well enough to isolate the problem to a demo? .add(() => gsap.to(nestedAni, {kill()}) // Did not work .add(() => gsap.to(nestedAni, kill()) // Javascript error .add(() => gsap.to(nestedAni, {kill}) // Timeline never started nestedAni.kill({"repeat:true"}) // Halted master timeline wo ending nested repeat nestedAni.killAll() // Same - halted master timeline wo ending nested repeat And, as the following is probably the same basic issue - not understanding how to code it correctly? Wrong format? .add(nestedTL(myVar), "+=.5") .play("Ending") // just ignored - bc it doesn't exist yet I guess? .addLabel("startLoop") .add(nestedTL(myVar2), "+=.5") .add(nestedTL(myVar3), "+=.5") .play("startLoop") // plays immediately, all .add before ignored .addLabel("Ending") .add(nestedTL(myVar2), "+=.5") I promised that I have taken at least 3 different intro to javascript courses - following along one with the coding, took me a few days. But none of them seem to explain HOW I apply some of what I read even in the docs here? Basically, either the docs provide a very basic introductory level javascript example - or I have NO IDEA how to apply it? Again, I've tried to learn the basics? Oh, and just tossing it out there - in my defense, I have managed to follow along to the point that I have been able to create a fairly lengthy animation. But... then I run into these snags as I'm "tweaking" and I'm just absolutely lost? But I must be missing something HUGE? Some VERY BASIC premise that I've got wrong or backwards? I'm using functions because I'm applying the same animation with different variables. And that part works. Is there a recommended intermediate javascript course that covers everything I actually need to know to at least follow along? I know I keep saying "thanks for your patience" as though it's an excuse - but I honestly don't know where to go? There's only "basic javascript" and then the 60+ hour courses on javascript? I wish I just knew what it is I didn't know - so I could specifically go and learn just that? Advanced javascript for GSAP? I'd hit up 60 hours for that? Then I could go back and review the bit on calling nested timelines as functions when I got mixed up? But most javascript courses? Ends up being the teacher going on about managing shopping carts for probably 59 of the 60 hours? And now... the advanced lesson on how to automatically create new shopping cart items from the SQL database. Oh... well please take our advanced course on SQL databases - 50% off with your code "NOITNEVERENDS" That bit you actually NEED for GSAP? Well that's special hidden content in our Super Advanced Javascript for Javascripters who Script Jovially but not for Java 'cuz Java is a Different Language Entirely and We Always Repeat That in ALL Javascript Courses Because Otherwise You'd Be Even More Confused Part 3 of 7, in the Bonus Extra Content Additions Addendum only available to Super Elite Lifetime Founder Members from Mars.
  6. I've got nested animations with endlessly repeating loops and all of those nested infinite repeats eventually need to stop. Not on clicking - most stuff I've seen has to do with clicking - just when it reaches a certain point in the master timeline. A very literal "screen goes black" moment - and then the master timeline should continue on again, only with the previous stuff no longer infinitely animating? I even did the black screen bit HOPING it then wouldn't be too complicated? Black screen. Dead. But maybe that's why a kill is the wrong thing - it would kill its own timeline? I have no idea - it just came up in searching for ending infinite repeats?
  7. The timeScale function is SO VERY AWESOME!!! The only hiccup now is that I'd prefer to ease into it? The abrupt change can be a bit too jolting? I tried setting a duration and ease, but either I did it wrong or it's just ignoring it? But no javascript error? .add(() => finAni.timeScale(12, {duration: 1, ease: "circ"}), "+=2") The slight changes aren't that noticeable really - but there's a "furious" bit - with the 12x - and it's just too abrupt? https://codepen.io/tibbeecode/pen/GREVvXa
  8. Just making a note - and it's probably common knowledge not to use GSDevTools on infinite repeats 'cuz it makes no sense to use it 'cuz the timeline is a thousand seconds. Duhr... But once I turned OFF ye olde GSDevTools, everything stopped freaking out? You can see it tripping out here And comment out GSDevTools and happiness returns. Oh, learning (how incredibly ignorant I am) is just SO MUCH FUN!!!! Yeah that's 3 hours of my life I'm never getting back Fred G is just laying into me HARD right now - "Ya BIG DUMMY!!!!!!" https://codepen.io/tibbeecode/pen/dyRBRYv
  9. I'm having to do my best to try to work through and digest all of this. I don't wish to not respond given everyone's been so helpful - but it could take me some time to work through it? I just have to delve through my code. Then I hopefully eventually find where it is I screwed up and have my Fred G Sanford "Ya BIG DUMMY!" moment with myself
  10. THANK YOU!!!!! That is SO AWESOME!!!! (I completely screwed up at first - I had the nested timeline set up as a function.)
  11. var random = gsap.utils.random(-200, 500, 10, true); AWESOME!!!! And very cool to know about the utility methods! Now I know which stuff can be set through variables? But, on the original topic I posted here, I still don't get why it is that - within a master timeline - I can't just tell it to speed up one of it's nested timelines with timeScale? I honestly still don't get WHY that's a javascript question? The reason *I* thought it was GSAP specific was because I'm trying to specify WHEN the speedup and slowdowns happen within the timeline? And if I set the timeScale as a variable WITHIN the nested timeline, and then call it again from the master - I get a "jank" because it's infinitely repeating. The repeat begins anew (which is logical yeah?) whenever I "call" it "afresh" again. So I'm not asking about a button or setting x - I'm asking how to apply timeScale to a nested timeline from the master timeLine. I have faceAni(happy), with faceAni being the nested expression timeline. And bodyAni with no variables, being the nested random body movement timeline. The two are sisters. Anyhow, when I call faceAni(happy) relatively at "+=2" within the master timeline, then I would like to increase the timeScale of the already running bodyAni nested timeline at that same time, then slow it back down to "normal" again when I call the next expression - for instance, faceAni(normal). But there is no "set time" for when any of these things happen. It would even be BETTER if I could set the timeScale of bodyAni from within it's sister timeline faceAni - but I hopefully "get" that I am most definitely then asking a javascript question? Because javascript has the rules about variable scope that likely prevent the sisters from sharing variables. My HOPE is that timeScale can be applied to a nested timeline from the master timeline and the timing of the "call" can be specified with "<" to match. ie faceAni(happy) at "+=2", immediately followed by bodyAni:timeScale(1.2) at "<". Anyhow, thus is my confuzzlement. And again, THANK YOU SO MUCH for pointing out the utility methods!!!!
  12. Thanks! He is most definitely awesome! And sorry, I know I'm communicating everything completely wrong If anyone's even interested, I'll try to explain better why it is I can't explain better? Here's the basic situation I've found myself in - How awesome is GSAP? Pretty awesome. So I'll commit to learning it. I'll use it for my project. Then... DAMN IT! How do I DO that? Hunt hunt hunt... OH! Cool! That's really awesome! Not really sure WHY that works - but... IT WORKS!!! Sweet! And so I'm ever deeper into my project. I wish to continue with my project. BUT I obviously need to quit my project and take 4 semesters of javascript, then find out that I really need to learn C to understand javascript, and binary to really understand C? And THEN, many years later, come back to my project But... screw that, right? FORWARD! This stuff is SO COOL! And that's how I've ended up annoying everyone. For instance - "random(1, 3)" - randomly picks a number between 1 and 3. And, even better, repeatRefresh: True, does exactly what's expected - fresh new randoms. But I think those are special GSAP parameters(?) I can't just declare let randomNum = random(1, 3). It can't exist outside a .to statement? That's where it "lives"? So, in the case of my randomly moving fish, I have a left and a right, and they need to be in sync. So I need the SAME random number for each, only reversed. Given that's a very likely scenario, my guess is that I just haven't yet found the GSAP parameter and method for that And look at me, saying words like parameter and method, as if I know what they mean. But is that a javascript question or is it a GSAP question? I very obviously have NO IDEA. So that's what I mean when I'm relating that - to me, GSAP is its own language? If I find myself "hunting" javascript to solve a problem, I'm most likely screwing up. And I did take the beginner javascript course that Carl recommended at CCC. The major stumbling block for me seems to be figuring out what these parameter things are and what order and why or if they're coded differently? GSAP is awesome regardless. But I honestly got into it thinking I didn't have to know that much javascript. Then it turns out that pretty much all of my problems aren't GSAP problems - they're... javascript problems? Again, just very honestly relating that I am still too ignorant to understand where one begins and the other ends. And whining that the only reason I'm dealing with javascript is to use GSAP. The world just ain't fair All of this to hopefully better relate - I PROMISE I'm not doing it on purpose.
  13. Creek

    Gettin' Hot in Here?

    My apologies again. The stupid errors were from a previous export from CodePen, linking to jquery for a stylesheet: <link rel='stylesheet' href='https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css'> <script src='https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js'></script> Believe it or not, drop those bad boys into an export of the above CodePen, and all hell breaks loose Whatever it is does not play well with others. Minus that idiocy, no more errors and no more Safari errors and no more fans. I'd just thought Illustrator possibly pumped out weird SVGs with alphas. Terribly sorry for bothering everyone with my idiocy. I'm obviously new to all of this, my brain is apparently wiped with all of the coding. No clue how I didn't spot the useless stylesheet. Very horribly sorry. Instead of reading this idiocy, I hope you're getting some sleep.
  14. The guidance here on GreenSock and from Carl at CCC have been SUPREME! I can promise you that I don't know where GSAP ends and javascript begins. The only reason I'm using javascript is to implement GSAP. But I do try to steer clear of "stuff" like this? I just thought maybe timeScale was special - that I wasn't allowed to call it on nested timelines? As far as hiring someone, I have to learn enough javascript to use GSAP. I look for examples and learn from how you gurus have put things together. I can take a code snippet, learn from it, rearrange it to get the job done. So I am very honestly trying my best to try to keep my questions to GSAP. If I screw up, I'm very sorry? From what little I understand, and I'm probably completely wrong? But I thought GSAP has its own special language that lives within javascript while allowing me to avoid javascript for the most part? So I promise that I don't know where I'm getting outside GSAP and falling into javascript world? But I promise I search and search and do my best to learn on my own before posting here. So is it cool if I post - and if it's off in javascript world beyond GSAP - then the moderators could just delete it or whatnot? Again, I promise I'm already trying to limit myself from posting here as much as possible. Only "brick wall" level stuff where I've been through it for hours and no solution. Mostly because of the possibly wrong concept I have about GSAP requiring GSAP coding and me mixing in javascript at my own peril? So I do my best to avoid doing that? Basically, hopefully obviously the very last thing I would wish to do is further annoy everyone
  15. Creek

    Gettin' Hot in Here?

    Safari delivers the message about shutting the window - but that's only if I just let it infinitely repeat. After a minute or so, Safari gets upset. Firefox is throwing up the alpha errors? There's a total of 7 of them I think? The only reason I mentioned it is because I thought maybe Illustrator tossed in alpha things that upset Firefox when I exported to SVG? I have no clue what an alpha is? I thought perhaps the mystery alphas might be what was upsetting Safari? But it'd be cool if there were a tool that would tell me I went too far with too many tweens at the same time - that it won't work on such and such devices? As usual, I have no clue as to whether such a thing exists? Here's a copy and paste of what Firefox is complaining about? Expected ‘none’, URL, or filter function but found ‘Alpha(’. Error in parsing value for ‘filter’. Declaration dropped. jquery-ui.css:51:9 Expected ‘none’, URL, or filter function but found ‘alpha(’. Error in parsing value for ‘filter’. Declaration dropped. jquery-ui.css:519:10 Expected ‘none’, URL, or filter function but found ‘Alpha(’. Error in parsing value for ‘filter’. Declaration dropped. jquery-ui.css:957:9 Expected ‘none’, URL, or filter function but found ‘Alpha(’. Error in parsing value for ‘filter’. Declaration dropped. jquery-ui.css:964:9 Expected ‘none’, URL, or filter function but found ‘Alpha(’. Error in parsing value for ‘filter’. Declaration dropped. jquery-ui.css:968:9 Expected ‘none’, URL, or filter function but found ‘Alpha(’. Error in parsing value for ‘filter’. Declaration dropped. jquery-ui.css:1216:10 Expected ‘none’, URL, or filter function but found ‘Alpha(’. Error in parsing value for ‘filter’. Declaration dropped. jquery-ui.css:1223:10