Hola amigos, soy algo novato con javascrip (solo conozco lo básico), tengo la siguiente animación en css3, (Nota, verlo preferentemente en safari, crhome o Firefox )

http://juangemelonet.zz.mu/casi%20terminado/

hice una cascada en css, pero no me gusto mucho, les muestro una versión muy anterior de mi animación

http://juangemelonet.zz.mu/anteriorsinmodificar/


como verán, tuve que recurrir a un gif para hacer la cascada, mi duda es ¿como puedo hacer una cascada en javascrip o jquery, para sustituirla en vez de la imagen? y ya abusando, tambien ¿como puedo hacer un efecto de movimiento de agua, para darle un toque un poco mas realista al choque entre el agua y la cascada?

Gracias amigos y espero su respuesta :)