Códigos Fuente de JavaScript

Animación que va mostrando por donde va pasando el raton los cocos que posteriormente se va comiendo el comecocos.

Código que muestra como realizar una búsqueda dentro de una <tabla> de html con Javascript.
Este ejemplo ha sido sacado del foro de JavaScript de esta página.

Simple SideNav Menu by 2K code

Menú lateral con efectos asociados a eventos...

Mejor con 2K max.

Juego en el que tienes que encontrar quince parejas de símbolos iguales de proyectos de software libre.
Dispones de dos minutos para hacerlo, y los errores penalizan en tiempo.

Juego en el que tienes que identificar la bandera segun el nombre del país que te muestre.
Los errores penalizan en el tiempo, y solo tienes 5 minutos.

Este simple código muestra como gestionamos los grados que ha girado cada elemento al pulsar con rotan encima de la imagen.

- Toda la programación está hecha en JavaScript.
- La visualización de los laberintos se basa en el elemento canvas de HTML5. Para los símbolos uso imágenes de 16×16 píxeles y para mostrar la solución uso círculos y rectángulos dibujados.
- La generación de laberintos se hace por backtracking y se obtiene un laberinto perfecto: cualesquiera dos puntos están conectados por exactamente un camino y no hay bucles. Lo elegí porque visualmente me pareció más atractivo.
- La salida (el cohete) y la llegada (la casita) las elijo para que estén lo más separadas posible, para conseguir que la solución sea un camino largo. En algunas ocasiones la curva resultante me recuerda a la curva de Peano.
- La solución del laberinto se obtiene buscando los puntos muertos, celdas que están rodeadas de tres muros; cuando se eliminan todos, las celdas que quedan son las que forman la solución. También me pareció más adecuada para su visualización.
- Para mostrar la solución utilizo un temporizador JavaScript ¡para cada paso! Nunca pensé que eso podría funcionar. Con la inocencia del novato, pensé en usar el equivalente en JavaScript a una función sleep() hasta que descubrí que ni existía ni se consideraba correcto escribirla, por lo que tuve que pensar un buen rato cómo conseguir lo que quería con temporizadores. Bueno, parece que funciona :)

Este código muestra como definir un evento sobre uno o varios elementos los cuales puede que todavia no existan, ya que puede ser que tengan que ser cargados por ajax.

Para ello, se utiliza una función on(), en la que se le define el evento, el elemento y la función a ejecutar, y se encarga de revisar el DOM en cada uno de los eventos que hemos configurado, para ver si coincide con alguno de los elementos que hemos definido.
Al hacerlo de esta manera, el evento se ejecutara también para nuevos elementos creados posteriormente a la definición del evento.

Es similar al evento definido en jquery: $(document).on('click', '.btn', handleClick);

Este sencillo código muestra como calcular el interés y amortización de una hipoteca o préstamo bancario.



Puedes ver este mismo código en PHP:
https://www.lawebdelprogramador.com/codigo/PHP/3924-Calculo-de-hipotecas-prestamos.html

Código que muestra como mediante JavaScript podemos adaptar un diseño a diferentes tipos de resoluciones.