son - parrafos en html ejemplos

¿Cómo desactivo la selección de texto con CSS o JavaScript?

Question

Posible duplicado:
Regla CSS para deshabilitar el resaltado de selección de texto

Estoy haciendo una galería HTML / CSS / jQuery, con varias páginas.

De hecho, tengo un botón "siguiente", que es un enlace simple con un oyente de clics de jQuery.

El problema es que si el usuario hace clic en el botón varias veces, se selecciona el texto del botón y luego la línea completa de texto. En mi diseño realmente oscuro, eso es realmente feo y sin sentido.

Así que aquí está mi pregunta: ¿Puede deshabilitar la selección de texto en HTML? Si no es así, extrañaré terriblemente el flash y su alto nivel de configuración en los campos de texto ...

Answer 1

No estoy seguro de si puedes apagarlo, pero puedes cambiarle los colores :)

myDiv::selection,
myDiv::-moz-selection,
myDiv::-webkit-selection {
background:#000;
color:#fff;
}

Luego, simplemente combine los colores con su diseño "oscuro" y vea qué sucede :)

Answer 2

Prueba este código CSS para la compatibilidad entre navegadores.

-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;

Answer 3

Puedes usar JavaScript para hacer lo que quieras:

if (document.addEventListener !== undefined) {
// Not IE
document.addEventListener(''click'', checkSelection, false);
} else {
// IE
document.attachEvent(''onclick'', checkSelection);
}
function checkSelection() {
var sel = {};
if (window.getSelection) {
// Mozilla
sel = window.getSelection();
} else if (document.selection) {
// IE
sel = document.selection.createRange();
}
// Mozilla
if (sel.rangeCount) {
sel.removeAllRanges();
return;
}
// IE
if (sel.text > '''') {
document.selection.empty();
return;
}
}

Caja de jabón: Realmente no deberías estar jodiendo con el agente de usuario del cliente de esta manera. Si el cliente desea seleccionar cosas en el documento, entonces debe poder seleccionar cosas en el documento. No importa si no te gusta el color de resaltado, porque no eres el que está viendo el documento.

Answer 4

ACTUALIZACIÓN Enero, 2017:

Según caniuse.com/#feat=user-select-none , la selección de user-select actualmente es compatible con todos los navegadores excepto Internet Explorer 9 y versiones anteriores (pero lamentablemente todavía necesita un prefijo de proveedor).

Todas las variaciones correctas de CSS son:

.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
supported by Chrome and Opera */
}

<p>
Selectable text.
</p>
<p class="noselect">
Unselectable text.
</p>

Tenga en cuenta que es una característica no estándar (es decir, no es parte de ninguna especificación). No se garantiza que funcione en todas partes, y puede haber diferencias en la implementación entre los navegadores y en el futuro los navegadores pueden dejar de admitirlo.

Puede encontrar más información en la documentación de Mozilla Developer Network .

Answer 5

<div
style="-moz-user-select: none; -webkit-user-select: none; -ms-user-select:none; user-select:none;-o-user-select:none;"
unselectable="on"
onselectstart="return false;"
onmousedown="return false;">
Blabla
</div>