Jump to content

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

Adding particle effects to Banner (Beginner)

Recommended Posts

Ok I have edited this post because since I started I have started to make things work with my own persistence.

I have implemented this effect into a banner.

See the Pen wBGvgW by MAW (@MAW) on CodePen


Can someone tell me what to add to make it stop after a certain time for example 10 seconds?

It seems to have a timeline of its own which I cannot control with the pause function. Also I don't seem to be able to put it on a specific level.. it is always on the top of everything. 



Many thanks.


Link to comment
Share on other sites

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.

  • Like 1
Link to comment
Share on other sites

  • 2 years later...


Did you managed to get this to work in a banner? I have been making banners for a year now using Animate CC only and I am so struggling with getting Particles into a banner while keeping the whole ting under 150kbs :(

Link to comment
Share on other sites

The reason the particles are at the top level right now is because of the z-index:2; in the css for the "dot".  Removing that (or giving the image a higher z index) will send the dots behind the image.

  • Like 1
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.