Jump to content
Search Community

Fountain with divs

Ryan Leenox test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi guys, today i was trying to reproduce a kind of fountain effect made of div with the following concept:

  • Create a javascript array
  • Push a div into the array 
  • Initialize its position with css wherever you want
  • Move the dive like a water spurt
  • Repeat with setInterval 

Well as you can see it's quietly easy, not that complicated but i was wondering how can i realize the fountain effect? well i mean, which kind of function do i have to use to give my animation this effect?

Here's an example of what i'm trying to reproduce.

http://cssdeck.com/labs/html5-canvas-fountain-exploding-particles-with-gravity

 

Note: the previous example is realized using a canvas, i'd like to reproduce it without canvas, only using divs, jquery and the TweenLite library.

 

 

TL DR: Which is the function i should use to reproduce something like that: http://cssdeck.com/labs/html5-canvas-fountain-exploding-particles-with-gravity using the TweenLite library?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...