Jump to content


  • Posts

  • Joined

  • Last visited

Everything posted by dax006

  1. Here's my newest project, proudly using the awesome GSAP library! http://daximation.com/index.php?p=33
  2. appears to break TweenMax.getAllTweens(true); You have to play() and pause() to get getAllTweens to work.
  3. Thank you! I had a brain fart and just couldn't figure it out, and here you solved it in a few minutes. I do now have a new issue in that tweens that bridge the time gap, so to speak, are ending too early. I need a way to change the ending location of that tween to be the current location... I can adjust the duration easily enough with .duration(), but x and y seem more difficult. Any ideas? Edit: Figured it out. Just had to make a new tween. Like so: (updateTo() does not work) if (tween.startTime() > tl.time()){ //if the tween starts beyond the current point, kill it tween.kill();//removes it forever }else if (tween.endTime() > tl.time()){ //if the tween ended beyond this point, that means it is currently ongoing. //create a new tween that ends at the current location.. this means rewinding the tween to calculate its start var savedtime = tl.time(); var savedcoord = getelementlocalcoord(this); var starttime = tween.startTime(); tl.seek(starttime); //jump var startcoord = getelementlocalcoord(this); tl.seek(savedtime);//restore location tween.kill();//remove old one var fromarray = {"x":startcoord.x,"y":startcoord.y}; var toarray = {"x":savedcoord.x,"y":savedcoord.y}; console.log(fromarray); var dur = savedtime-starttime; tl.fromTo(this,dur,fromarray,toarray,starttime); //create new tween }
  4. the math of the easing function is going to cause a jump. I see you do have linear.easeNone set, but.... just something to double-check
  5. How do I kill tweens past a certain point in time? So, I have a timeline with a bunch of tweens all starting at random times. I want to remove tweens of certain elements that either start past a certain point in time, say, 5 seconds, or tween beyond that point in time. I know about killTweensOf(), but now how do I killTweensPastTime()? I searched google and these forums but couldn't find anything. Thanks, John
  6. worked great first try, thank you! Now I just need to style it... its a little plain Edit: a pain to edit. One is better off learning the jquery UI slider.
  7. again Thank you thank you thank you!
  8. I finally figured it out. I have a tween of length 0, and I was setting its progress to 0. I expect setting progress to 0 to jump to the START of the animation. instead it was jumping to the END of the animation. http://codepen.io/dax006/pen/WrBmEa My apologies for the confusing question, I was trying to solve three separate problems in one question. You guys pointing out the known bug made me turn my tweenMax's into tweenLites, and then the other problem became clear. So I couldn't have solved it without you, thank you!
  9. I built a minimal slot-machine animation here: Its buggy but you should see the idea. Not much logic is needed for the animations. http://codepen.io/dax006/pen/LGoNrE Change the css to set your symbols to whatever image you want, and add a button to trigger the 'slowing' tween.... I took those out for the codepen.. Here is the full version http://johnktejik.info/slots/v2/index.php
  10. You're right about the malformed code, my link to my codepen was wrong, that was my early version that I edited but apparently the changes didn't get saved. http://codepen.io/dax006/pen/LGoNrE should be the right link I have read the documentation and my usage of how I create the animations is copied from your demos. I didn't use timelines because I only needed two animations, and I felt using a timeline was overkill. I will look at the code of another guy making a slot machine, thanks for that. The codepen is as simple as I can make it. So I found a known bug and have to use the beta version and I can't use absolute positioning in my CSS. Got it. This actually does help. Thanks, you guys rock.
  11. this is my first attempt using GSAP (it seemed to be the best animation library I could find). I'm trying to create a simple slot machine. Here is a codepen with the minimal amount of code. http://codepen.io/dax006/pen/LGoNrE It does 3 things. After creating a random symbol, it 1) creates a 'constantly spinning' tween and saves it 2) creates a 'slowing' tween and saves it 3) resets the progress of each tween/symbol to be 1/4th down the screen. Bug/problem #1 - Tweens are playing yet NOWHERE do I play() the tween. The tweens are PAUSED by default. Even if they are not paused, I IMMEDIATELY pause() them in resetslot(). Problem #2 - Progress() does not seem to be setting all symbols accurately (you can immediately see that the top symbol is askew) Problem #3 - Setting a tweens progress() to zero triggers its onComplete (watch the console) Problem #4 - Setting a tweens progress to 1 triggers its onComplete even though I have SuppressEvents:true (watch the console) I'm very frustrated with GSAP at the moment . Any help is appreciated -John Edit:problem 5 can't pause the codepen demo so can't read console