Javascript

Vanilla JS: on load

A continuación un par de formas de comprobar en JavaScript cuando se ha cargado la página completamente. Si quieres saber cuando se carga toda página, incluido su html, imágenes, css, js… puedes usar alguno de estos 2 códigos js: window.addEventListener('load', […]

Leer más...

Para clonar un determinado elemento/s es muy sencillo usando el método cloneNode() de javascript, con el cual puedes clonar solo el elemento padre o tmabien los hijos que tenga este. Clonar solo el elemento «padre» const clonar = document.querySelector('.mi-elemento').cloneNode(); Clonar […]

Leer más...

Vanilla JS: foreach

A continuación como recorrer un array usando el método forEach() de vanilla javascript. Vamos a ver 2 ejemplos diferentes, uno usando unos elementos del dom, y otro con un array en una variable. Ejemplo 1. Vamos a recorrer todos los […]

Leer más...

Para detectar y obtener la posición del scroll vertical («y») en pixeles en vanilla js es muy sencillo. Básicamente necesitamos usar el evento onscroll para detectar el movimiento del scroll y scrollY para obtener el valor en pixeles del desplazamiento […]

Leer más...

Para obtener el ancho o alto de la «ventana» actual en javascript, basta con usar el objeto window con la propiedad innerWidth para el ancho, y innerHeight para el alto: var ancho = window.innerWidth; var alto = window.innerHeight;

Leer más...

Simple código vanilla js para detectar si estamos scrolleando hacia arriba o hacia abajo usando el método addEventListener para detectar el scroll y getBoundingClientRect para conocer la posición. var scrollPos = 0; window.addEventListener('scroll', function(){ if ((document.body.getBoundingClientRect()).top > scrollPos) // ARRIBA […]

Leer más...

Código javascript para detectar si el ratón esta en movimiento, y en esa caso ejecutar alguna otra tarea. En este caso voy a añadir una clase al body solo cuando el ratón esta en movimiento, y cuando esta parado pues […]

Leer más...

Ejemplo javascript sencillo de cuenta atrás de x segundos. Como ejemplo de cuenta regresiva de 10 segundos: window.onload = updateClock; var totalTime = 10; function updateClock() { document.getElementById('countdown').innerHTML = totalTime; if(totalTime==0){ alert('Final'); }else{ totalTime-=1; setTimeout("updateClock()",1000); } } Demo:

Leer más...

Ejemplo de código javascript para ofuscar o camuflar enlaces fácilmente a ojos de los bots. Existen varias formas, esta es la que mas me gusta, y mas sencilla de implementar si lo haces con intención seo por ejemplo. Me gusta […]

Leer más...