random circles dropping from the top

[schugabug]

Hi!

I am trying to simulate random size circles with random timing,  dropping from the top of my page and fading out.  It is working but I am sure that there is another more efficient way of doing this.  I want it to expand across the top of the page.  I'm a beginner at jscript and use to use gs flash.  Things have changes alot since i was last doing this and I need to catch up with javascript.  Can anyone show me what to do to make it more efficient?  My code pen page is :

See the Pen jymeJG by barb1643 (@barb1643) on CodePen

Thanks in advance!

Barb

 

See the Pen jymeJG by barb1643 (@barb1643) on CodePen

[OSUblake]

Hi @schugabug,

 

One thing you should do is animate x/y instead of left/top. For randomness, I create my animations inside a recursive function, a function that calls itself again. Inside that function, I assign random values using a random function, passing in a min and max value.

 

Here's a simple demo I set up with a lot of variables you can play around with.

See the Pen 44501102819225c54db46136a2655010?editors=0010 by osublake (@osublake) on CodePen

 

 

.

[schugabug]

Hi OSUblake!

That works perfectly and is exactly what I was looking for!  Now if I can just get my mind to work like that I'll be in good shape!    Here it is in use..

See the Pen dNRGgd by barb1643 (@barb1643) on CodePen

Thank you!

Barbara 

[PointC]

Hi Barbara

 

We all want our brains to operate like Blake's mind, but it's simply not possible. I guess nobody told you - Blake is an AI created by Jack. He resides in the Matrix and monitors the GreenSock website. 

 

We are truly lucky to have him running around here. He's a talented coder and a really nice guy. I'm glad he found a solution for you.

 

Happy tweening.

[schugabug]

Hi,

The circles are fall perfectly on codepen, but when I move it to my site  I can't seem to get it to work properly.  It was working in Dreamweaver and then it stopped, so I started messing around with the links etc and it worked and then stopped working. It could be I am missing a cdn or jquery.... I don't know what the problem is, can someone take a look?   I use to work on this in flash so this setup  is all new to me .

Thanks in advance... http://www.bschug.com  It still works in codepen... 

See the Pen dNRGgd by barb1643 (@barb1643) on CodePen

 

Barbara

[PointC]

Looks like you have a typo with an uppercase 'S'

// make it https and it should work.
<script src="httpS://www.innerspiritualcenter.org/fccimages/main.js" type="text/javascript"></script>  

Happy tweening.

[schugabug]

no, sorry its not working, It wasn't working before I changed that link.

[PointC]

It's hard to say without being able to test any code, but obviously it's something on your site since it's working correctly on CodePen. The uppercase 's' was the first thing that jumped out at me.

 

I see there's also a dead link to jQuery 1.11.3 on line 15. You're also loading jQuery 3.1 on line 16 so I'd try removing that dead link.