Jump to content

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

celli last won the day on January 3 2016

celli had the most liked content!


  • Content Count

  • Joined

  • Last visited

  • Days Won


Everything posted by celli

  1. yes, those are really great. Thanks! They give me some ideas.
  2. I have a simple wiggle in the codePen example, and I'm trying to see if I can save the position after each circle moves into it's first position and then move it around again randomly (all within the blue box). Right now when it wiggles, it returns to it's original position in-between each wiggle. Is that possible ? I looked at the 'swarm' example, but I am having a hard time making sense of the code, and I really would like to see how I can capture the position after it moves out into position the first time, and then move each circle around from that position each time it wiggles around. Tha
  3. Hi Dada78, I added this to your playEnd function and it will fade out the steam, and then remove it completely: .to("#steam, #steamPosition", 1, {autoAlpha:0}) .set("#steam, #steamPosition", {display:'none'}) hope that helps. -Celli
  4. On point and perfect, as usual Point C !!
  5. One more question to add to this. I wanted to get variation between each of the instances that my timeline fires, so that each time it plays the arrangement of the circles would be randomized. If I YoYo and repeat, it obviously would give me the same randomization that played the first time my timeline played. Then I figured if I created two timelines and used an onComplete:restart then they would alternate, giving me a different random arrangement of my circles every time--it works the first two times it plays, for obvious reasons, but I guess when each timeline 'restarts' it actually
  6. Blake, these are very useful and a launchpad for many ideas. thank you!! You guys are incredible.
  7. ahh yes, perfect ! Why didn't I think of that. Awesome update guys !!
  8. I am sure this is possible, I am trying to get my x and y values to go between 100px and -100px from their starting points, but it seems to only honor the -100 value and move to random positions within that one range (0 to -100), and not my 100px value, which would position some in the opposite direction. My codePen should show what I mean.
  9. celli

    GSAP call function

    You can change your opacity to autoAlpha on line 24 of your JS code autoAlpha: 0, and also add the CSS to hide your text when the page loads .container .anim-text [class^="char"]{visibility:hidden;}
  10. thanks for the effort PointC !
  11. Does anyone know how to get a form's 'placeholder' text to respond to GSAP splitText ? It is working if I change my selector to an h1 tag, as a test--but I can't seem to select the placeholder text from a form field to perform splitText on that element.
  12. In DoubleClick Studio the message says "On June 30 the ability to upload new Flash creatives will be removed as DoubleClick Digital Marketing goes 100% HTML5. Make the switch to HTML5 now." Which makes total sense--in DCM that message might be referring to the updated names that doubleClick is giving to HTML5 creative or as Somnamblst suggests something for publishers or folks who book the ads.
  13. Hi Jonathan, That is perfect! autoRound: false is exactly the trick !! ...and the tip about using the GSAP set() method is also an awesome addition. Thank You !!
  14. I minimized the content in my codePen as much as possible to try and isolate the problem wfor my question--but there might still be a lot of content there. I am concentrating on clicking one of the thumbnails In my codePen, and when I do the ".workReveal" div is animating it's height according to the height of each of the images. In Chrome the animation is buttery smooth, but in Safari on a new fast computer, it is terribly slow. You can see it when the thumbnail boxes move down the page and when you click the "X" to move the thumbnail boxes back up the page, the animation is very choppy a
  15. Hi Buster, The repeat is on -1 which will repeat infinitely, so if you change that to something like 5, for example, it should only repeat 5x. TweenMax.to(elm,R(0,5)+3,{y:h,ease:Linear.easeNone,repeat:5, delay:-5}); To set this on it's own layer, you should wrap it in it's own <div> and then set the position to absolute and the z-index to whatever you'd like, and that should give you the control to place this on whatever layer you'd like.
  16. Hi Aleguitar77, It seems simpler that what you are trying to code in the codePen. Try this and it will work: //pause this button's animation on mouseenter btns.mouseenter(function(){ this.animation.pause(); }) //play this button's animation on mouseleave btns.mouseleave(function(){ this.animation.play(); })
  17. Hi wenjinfei, Here is a quick way using GSAP to position an element and have it stay in the center: http://codepen.io/celli/pen/dXPxMW
  18. Perfectly explained PointC. thank you!
  19. Thanks everyone! @RedGlove ditto on the logo, awesome !!
  20. PointC, that is absolutely awesome. It works perfectly ! Where did you get the .125 number from ? Not that this is a GSAP thing, but is there a reason that the body (caused by the wrapper/outer divs) remains at 600px in height after it scales down (and we get a vertical scrollbar), or a way to reduce the height of the wrapper/outer divs to the height of the div, when the div scales ?
  21. I am trying to get my div, including all of the contents inside of the div to scale proportionally, if my window-width is under 840px, so that the div and it's contents will scale with the window width. In my codePen I am achieving this with 'window.matchMedia' and setting TweenMax to scale my div and it's contents, which works... however I'd like to be able to have the div and it's contents' width be equal to my window width (if my viewport is under 840px wide) on page load and page resize. How can I add to my code to make that happen ? I also tried a completely different way using someth
  22. Thanks guys -- this is very, very helpful. Yes, I felt it was something along those lines, and this explains it a lot better for me. Now it makes so much better sense. I wonder is there a way to actually see when there are multiple Tweens fighting for control of the same property on the same object, like the console to see it, maybe ? But It's then again, it is easy to spot I guess! I think I find it a lot because I try to get that control of the overlap, but I totally see it cannot be of the same object.
  23. I have actually asked this almost same question before in a post http://greensock.com/forums/topic/12472-clearprops-with-svg-elements --it's killing me to ask again, but I think something is a little different this time, and I am stuck trying to figure out the best solution--or maybe I just haven't been able to grasp how to do this exactly right yet. If I run my timeline the first time, it runs perfectly. When I add {repeat:-1} to my timeline, it repeats fine, but then the circles start at different positions, and their scale is not re-set. Which makes perfect sense, because that's where
  24. PointC! You are on point, and a perfect solution as usual ! Thanks