Interactive Water Ripple
Tap Water!
Water ripples appear where you tap. The water renders dynamically with JavaScript. Radial gradients move outward in concentric circles.
Tap the Canvas!
Procedural Water
Learn how to implement procedural water. Dynamic water effect generated with JavaScript and radial gradients. See the water ripple tutorial for more information.
Scroll Events
This example doesn't respond to scroll
events.
Learn to respond to
scroll
events with the Drag a Sprite
series of tutorials.
If you're unfamiliar with radial gradients see the Introduction to Radial Gradients Tutorial
.
See twelve animated and still, procedurally generated, visual effects prepared with HTML5 and JavaScript, at Seven Thunder Software. Examples link to free Web development tutorials. Learn to code!