If you’ve ever seen a Java applet in a web page, chances are it was only there for one purpose: to add a “rippling lake” effect to an image. Why Java never took off we’ll never know! But now, thankfully, we can remove all those Java applets from our web pages and replace them with this lovely modern HTML5 canvas version instead.
Lake.js is a fun retro canvas effect you can apply to any image element. It’s a jQuery plugin that inserts a canvas element directly beneath an image. In that canvas it displays a flipped version of the image with an animating, rippling reflection. You can also adjust the speed, scale and number of waves used in the effect.
Have a look at the demo page or grab the source code from GitHub and, as it suggests, make some “cool ass lakes”!
Even if you insist on sticking with your Java applets for that extra retro kudos, the source code is great to pore over as it shows exactly how to manipulate pixels using canvas. Play around and see what other effects you can make!