css - navegador - Cómo eliminar el botón predeterminado resaltado en Safari cuando se usa jQuery

quitar focus input css

Question

Me he dado cuenta de que en Safari en OS X mis botones jQuery predeterminados parecen tener un resplandor azul alrededor de ellos. Acabo de verificar y sucede lo mismo en la página de demostración de jQuery UI .

Bajo Firefox en mi misma máquina, parece que esto

¿Alguien puede decirme qué puedo hacer para eliminar esto en Safari? Todavía me gustaría el comportamiento predeterminado.

Answer 1

Este botón tiene una propiedad de esquema definida. Tienes que anular esto. Si inspecciona esto en Firebug, verá la siguiente declaración de CSS para este botón:

.ui-dialog .ui-dialog-buttonpane button{outline:none;}

Answer 2

Intenta usar esto

En CSS:

-webkit-tap-highlight-color: rgba(0,0,0,0);

En Javascript:

document.addEventListener("touchstart", function(){}, true );

Answer 3

Para eliminar cualquier resalto de entradas que cualquier navegador pueda aplicar como acción predeterminada, siempre puede usar outline:none para su CSS. en tu caso es un elemento de button . así que esto debería funcionar:

button {
    outline: none;
}

Aunque no se recomienda eliminar el esquema CSS. ya que es malo para la accesibilidad. (Gracias Robin Clowers por mencionar esto)

Answer 4

*{
    outline: none;
}

.blah{
    outline-color: blue;
}

Esto no afectará a los existentes. ( .blah ) Esto también funciona en Google Chrome.

Demostración en vivo: http://jsfiddle.net/DerekL/TUbjc/