1

Quiero hacer que cuando presione cualquier tecla el tamaño de la letra aumente pero no sucede eso El siguiente codigo es:

function cambiarTamañoFuente(event) {
  const div = event.target;
  const nuevoTamañoFuente = "24px";
  div.style.fontSize = nuevoTamañoFuente;
}
const dic = document.getElementById("parra2");
dic.addEventListener("keydown", cambiarTamañoFuente);
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ejercicios js</title>
</head>
<body>
    <div id="parra2">Hola Mundo 2</div>
    <button type="button" id="calc" >Presiona</button>

    <script src="script.js"></script>
</body>
</html>

El elemento id seleccionado hace referencia a un parrafo con el texto en mi html, no logro poder hacer que ejecute los cambios presionando cualquier letra , si me ayudan a poder hacerlo funcionar estare agradecido

0

1 respuesta 1

1

Tu div nunca adquiere el foco, por lo tanto el evento keydown nunca se ejecuta dentro de él.

Para que adquiera el foco basta con agregar tabindex="0" al HTML

Ejemplo:

function cambiarTamañoFuente(event) {
  const div = event.target;
  const nuevoTamañoFuente = "24px";
  div.style.fontSize = nuevoTamañoFuente;
}
const dic = document.getElementById("parra2");
dic.addEventListener("keydown", cambiarTamañoFuente);
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ejercicios js</title>
</head>
<body>
    <div id="parra2" tabindex="0">Hola Mundo 2</div>
    <button type="button" id="calc" >Presiona</button>

    <script src="script.js"></script>
</body>
</html>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.