Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

155
Vistas
how to keep track of letters in text overflow?

Hi Im working on a big project and the code is very complex to share parts of here. but i need to keep track of the letter that ii typing while the length of the name is bigger than the container. as you see in the video when text goes over the container it doesn't follow the letter that is being typed and you have to manually scroll. i need to follow the letters as i type it. note: the text box is not an input from html its a dive and the text is being typed by creating child divs in the text div that contain individual letters. the project is a mobile app built in cordova and it only works with a virtual keyboard no real physical keyboard functions here.

<div class="text-box">
<div>J</div>
<div>O</div>
<div>H</div>
<div>N</div>
</div>

enter image description here

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

You could add an event listener to the div which listens for key presses and then scrolls to the extreme right of the div (unless it is a backspace or delete key which is pressed) using the following code:

let display = document.getElementsByClassName('text-box');
let maxXscroll = display.scrollWidth - display.clientWidth;


display.addEventListener('keydown', function() {
    if((e.which != 8) && (e.which != 46)) {
        display.scrollLeft = maxXscroll;
    }
})

I apologise if my code is not good (it worked for me) or my answer is insufficient but I hope it helps you!

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda