12 Insanely Awesome Javascript Effects

12 Insanely Awesome Javascript Effects


12 Insanely Awesome Javascript Effects

Introduction

Alright, have you ever seen these effects? Awesome, stunning and cool javascript effect! It's part of the chrome experiment and it's amazing. When I first look at it, I was like, whoa, that couldn't be done with flash few years ago!

I have chosen 12 of them that I really like, and I hope you will enjoy them. Best view with google chrome, firefox or Internet explorer will be a little bit laggy or could not run at all.

  • Canopy

    Canopy is a fractal tree zoomer, vector style. Press play to start falling, click to go faster. Try turning Mutation and Bloom on. The tree will get a little weirder.
  • Ball Pool

    Start by shaking the browser, then create new balls (click on empty space), move some others (drag) and reset the screen (double click).
  • Starfield

    A simple starfield (512 stars).
  • Floating cube

    Floating cubes make the words "Chrome Experiment".
  • 3D Model Viewer

    Javascript 3d Model Viewer is an experiment realyzed with javascript and canvas element (HTML 5). It's possible to view 3d models (dinosaur, ship, helicopter), rotate them, change color and transparency and add a motion blur effect.
  • Many Lines

    Line drawing via particle system
  • Depth of Field

    300 balls form a plane, a cube, a little universe, a sphere and then disappear. Unfortunately this piece is shy and doesn't want to interact with you yet. But nothing stops you from watching it from any angle.
  • Fish

    Some fish gather in shoals in order to avoid predators. Your mouse is the predator and they will avoid it, scare them as much as you like but they'll still come back.
  • Liquid Particles

    Play around with particles and their liquid-like motion, move your mouse through them, occasionaly click or hold down the mouse button.
  • Orange Tunnel

    Classical tunnel effect, demoscene style.
  • Colors Cube

    Colorscube is a simple mapping of the RGB colorspace into 3d. A little bit of alpha goes a long way. Try it in black.
  • Kaleidoscope

    A kind of kaleidscope made only of filled circles with opacity. All parameters are random, so the scheme change everytime.

Author: Kevin Liew

Kevin Liew is a web designer and developer and keen on contributing to the web development industry. He loves frontend development and absolutely amazed by jQuery. Feel free to say hi to me, or follow @quenesswebblog on twitter.

Share the love

29 comments

rory
Wed, 7th April 2010
Love jquery treats on a tuesday...
Ball Pool is very cool, with a smooth action. Canopy is beautiful reminds me of the start of the film 'Watership Down'.... yeah the one with the rabbits!! Cheers for the jquery showcase. Reply
Dr Bloke
Wed, 7th April 2010
Love it! Reply
Derrick
Wed, 7th April 2010
This is very impressive! I can't wait until webGL is more widely adopted, so we can have MUCH faster, hardware accelerated 3D. Reply
Motyar
Wed, 7th April 2010
Humnn all these are HTML5 and chrome examples. You should check some pure jquery animations at http://motyar.blogspot.com/search/label/Animation Reply
Mehdi Mousavi
Thu, 8th April 2010
Truly amazing! Reply
Jordan Walker
Thu, 8th April 2010
so impressed with jQuery. Reply
denbagus
Sat, 10th April 2010
wow... very awesome..!! :) Reply
Webanddesigners
Mon, 12th April 2010
Cool effects Reply
Free Javascript Codes
Wed, 14th April 2010
that's all very cool & great js effect, thank you very much for sharing.

Can I <a href="http://www.javascriptbank.com/submit/">share this post</a> on my JavaScript library?


Awaiting your response. Thank Reply
دنيا الدلع
Sun, 16th May 2010
nice stuff

thanks Reply
Jatin Mehta
Sun, 16th May 2010
nice one, thanks Reply
O.M.
Thu, 9th September 2010
very impressive vision, .... Reply
Tom
Wed, 22nd September 2010
Loved the orange tunnel. Reply
BobM
Sat, 16th October 2010
Maybe cool effects. NONE of them work with IE8... Most likely, you don't belive in IE. Also most likely, you don't have any paying customers... Reply
alpha123
Fri, 28th January 2011
That would be because they are Chrome experiments....
Which logically work the best with Google Chrome. Reply
Brett Widmann
Fri, 10th December 2010
These are really cool effects! Thanks for sharing. Reply
Ravi
Wed, 15th December 2010
Very nice article! Thanks for sharing it with us! Reply
Ro
Wed, 30th March 2011
Really cool effects man. Love it. They're awesome. Reply
samsol
Thu, 5th May 2011
check my 3d demo developed in raphael javascript library: www.samsol3diphone.blogspot.com/p/3d-demo-in-javascript.html Reply
Oriza
Thu, 9th June 2011
I just Can say WOw... how can they make that Reply
mehdi
Tue, 24th January 2012
Very Very Very GOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOD Reply
Bob
Tue, 21st February 2012
Wooooooa! This is great! Reply
takeshi castlefree
Tue, 8th May 2012
is this also a html 5?http://linesforme.blogspot.com/ , it flips and moves around. just like on the post above Reply
raj badra
Mon, 29th October 2012
its so niccccccccccccccccccccccccccccccccccccccccccccccccccccccccccce Reply
Aqib Shahzad
Sun, 16th December 2012
nice article keep it up !!!
and nice work on this site Reply
Jason
Mon, 28th January 2013
I never knew that we can do so much with javascript and jquery. Really its fantastic. Reply
Lamin Sanneh
Sun, 21st April 2013
Wow...this is brilliant... Saw the link from .net rocks podcast..... Just a quick question....does your site have email newsletter subscription? Reply
Tim Saelee
Fri, 28th June 2013
totally inspired. wow! Reply
aksoajsa
Sun, 22nd September 2013
Heloo are you? Reply

Leave a Comment

Please keep in mind that comments are moderated and rel="nofollow" is in use. You can use [code][/code] if you want to write codes. Don't spam us :) Thanks!

Advertisement