Soy bastante nuevo en HTML, CSS, JS y actualmente estoy trabajando en hacer un proyecto de página web.
Lo que estoy tratando de hacer actualmente es animar algo como esto:
(con efecto de máquina de escribir) "¡Hola gente!" (retroceso para borrar texto) "hola amigos" (pausa, cursor de máquina de escribir parpadeando)
(el cursor va a una nueva línea, comienza a escribir en un color/fuente de texto diferente) "Este es mi primer gran proyecto..."
Encontré un script existente en GitHub para el efecto de máquina de escribir/retroceso, y este es mi código hasta ahora:
var typed = new Typed(".auto-type", { strings: ["Hello people!^1000", "Hello friends.^1000"], startDelay: 1000, typeSpeed: 170, backSpeed: 50, cursorChar: '\u25ae', autoInsertCss: true, smartBackspace: true, }) <h1><span class="auto-type"></span></h1> <script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.12"></script>¿Podría alguien darme una pista sobre cómo terminar la nueva línea con un color/fuente diferente?
puede usar la etiqueta html en el tipo para que pueda:
<br/> adentro para multilínea var typed = new Typed(".auto-type", { strings: ["Hello people!^1000", "Hello friends.^1000", "Hello friends.<br/><span class=\"my-big-project\">This is my first big project...</span>^1000"], startDelay: 1000, typeSpeed: 170, backSpeed: 50, cursorChar: '\u25ae', autoInsertCss: true, smartBackspace: true, }) .my-big-project { color: blue; } <h1><span class="auto-type"></span></h1> <script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.12"></script>