• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

139
Vistas
Showing last part of input text when it is not on focus any more?

In the case of input whenever we focus out or click outside the input field we see that the right part of the over text is hidden and only the left part shows but I want the reverse of it.

<input value="abcdefghijklmnopqrstwxyz123456789">

Like in the above input field we can see "abcdefghijklmnopqrstwxyz1" and the rest part("23456789") is hidden but I want to show "klmnopqrstwxyz123456789" (last part instead of the first part) and hide the first part "abcdefghij" without CSS direction.

almost 3 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

Via javascript, we can achieve it with the help of blur event.

On blur, we capture the input's current Element.scrollLeft . Next, we reset the scrollLeft position to Element.scrollWidth wrapped in a setTimeout() to ensure the browser waits to render the queued change.

const elem = document.getElementById('data');

elem.addEventListener("blur", () => {
  setTimeout(() => {
    elem.scrollLeft = elem.scrollWidth;
  }, 0);
});
<input id="data" value="abcdefghijklmnopqrstwxyz123456789">

almost 3 years ago · Juan Pablo Isaza Denunciar

0

Below piece of code - for dynamically change the length of your text on changing the content

function a (t){
    t.size = t.value.length
    console.log(t)
}

<input onkeyup="a(this)" value="abcdefghijklmnopqrstwxyz123456789">
almost 3 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 Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda