Animación de escritura vintage con efecto de sonido-Typewriterjs

Tiempo de ejecución: 30 minutos. Empezar

Autor: EOussama
Views Total: 589
Sitio oficial: Ir a la web
Actualizado: January 4, 2018
Licencia: Apache-2.0

Vista prévia

Animación de escritura vintage con efecto de sonido-Typewriterjs

Descripción

Typewriterjs es una biblioteca de JavaScript vainilla que aplica un efecto de escritura tipo máquina de escribir a contenido de texto con soporte para el cursor personalizado y efecto de sonido.

Funcionamiento

Descargue e inserte el Typewriterjs en el documento.

<script type="text/javascript" src="scripts/typewriter.js"></script>

Cree una nueva instancia de TypeWriter y especifique el contenedor de destino & texto a la salida.

new TypeWriter({


target: document.getElementById('container'),


text: 'WIKICSS.COM'
});

Personalice el tiempo de espera antes de escribir el siguiente carácter.

new TypeWriter({


target: document.getElementById('container'),


text: 'WIKICSS.COM',


time: 200
});

Activar/desactivar el efecto de sonido.

new TypeWriter({


target: document.getElementById('container'),


text: 'WIKICSS.COM',


time: 200,


audio: true
});

Personalice el cursor que se mostrará al final del texto mientras escribe.

new TypeWriter({


target: document.getElementById('container'),


text: 'WIKICSS.COM',


cursor: {



activated: true,



type: 1 // '_' or '|'


}
});

API methods.

instance.type();
instance.delete();
instance.stop();
instance.pause();
instance.resume();
instance.setText(text);
instance.setCursor(cursor);
instance.setTime(time);
instance.setAudio(audiopath);

Registro de cambios

01/04/2019

  • Controles de cursor añadidos.

01/02/2019

  • Se han corregido algunos errores al detener la máquina de escribir.

Te puede interesar: