Leaderboard

It seemed to make the most sense to add that feature to CSSPlugin, so here's simple example with a preview version of the upcoming release: https://codepen.io/GreenSock/pen/OgJmbg?editors=0110 (notice it's animating a px-based blur as well as a color variable). Look good? Any other suggestions?

Hi @Chris, Like @Carl said, canvas is definitely the way to go for particle animations. If you've never used canvas before, a library like Pixi.js might be the best way to get started. It uses an API similar to Flash, and is focused on moving things around the screen as quickly and efficiently as possible. I converted your demo over to Pixi. I created 15 different particle waves with 1000 particles in each one. When you mouse over the canvas, it will play a different particle wave, that is of course if all 15 aren't playing at the same time. It checks to make sure the timeline for a particle wave is not active before calling restart on it. The particles are being rendered at the speed of light.

Hi @alan0buchanan There are a couple options for you. TweenMax.isTweening() or isActive() can check on any active tweens for you. https://greensock.com/docs/#/HTML5/GSAP/TweenMax/isTweening/ https://greensock.com/docs/#/HTML5/GSAP/TimelineMax/isActive/ Hopefully that helps. Happy tweening.

Hi @olivetum Welcome to the forum. I'm not quite sure what you're asking or what should be happening in your animation, but if you want to target the #text div inside the #logo div, you can use find() like this: TweenMax.to($(this).find("#text"), 1, {. . .} ); Hopefully that helps. Happy tweening.

The CSSRulePlugin didn't seem to work, so for now you're probably going to have to manually update the variable using a generic object. http://codepen.io/osublake/pen/f3a6dffce455ecb1caa48641e3ecd278?editors=0010

Hi Technics1210 , I took a slightly different approach to your train. It may make things easier for you. http://codepen.io/PointC/pen/bEbvwP Hopefully this helps. Happy tweening.