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

321
Vistas
Permanently change selected text background color

How can I permanently change the background color of DIV text when I select it ? What I am trying to achieve is a highlight effect like this: enter image description here

Anyone can instruct me how to accomplish this with javascript?

I appreciate your help a lot.

EDIT: I need my text to stay highlighted and highlight multiple texts without losing the highlight of the previous ones.

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

0

You need to add event listener in javascript and when a text is selected at that time need to change the color like below

function logSelection(event) {
  // Get Selection
  sel = window.getSelection();
  if (sel.rangeCount && sel.getRangeAt) {
    range = sel.getRangeAt(0);
  }
  // Set design mode to on
  document.designMode = "on";
  if (range) {
    sel.removeAllRanges();
    sel.addRange(range);
  }
  // Colorize text
  document.execCommand("ForeColor", false, "red");
  // Set design mode to off
  document.designMode = "off";
}

const input = document.querySelector('input');
input.addEventListener('select', logSelection);
about 4 years ago · Juan Pablo Isaza Denunciar

0

Use ::selection selector to override the default color:

::selection{
  background: #FFD24D;
}
<p>A team of horses will struggle to chase down a spoken word.</p>

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