2011-05-02 24 views
5

Ver violín: http://jsfiddle.net/csaltyj/P2sLa/CSS importante no parece trabajar en jQuery/Firefox 3.x

En Chrome, esto funciona bien, pero en Firefox no lo hace, y produce una advertencia Javascript. Sé que! No es necesario aquí, pero tengo un proyecto a gran escala donde es necesario, y está causando que Firefox se rompa. ¿Algunas ideas?

+0

'! Important' funciona bien en FF 3.x para mí ... ¿me puede dar más código aquí? – pixelbobby

+0

@pixelbobby ... no funciona en FF 4, el error es 'Advertencia: final esperado del valor pero encontrado '!'. Error al analizar el valor de 'fondo'. Declaración caída. – Hristo

+3

¿Puede explicar por qué es "requerido" en su proyecto? Realmente no tiene ningún sentido, ya que los estilos de elemento siempre superan a los estilos de las hojas de estilo de todos modos (hasta donde yo sé). – Pointy

Respuesta

11

La búsqueda de "jquery css important" apareció a blog post explaining the "problem".
voy a publicar alguna información adicional, pero para hacer una larga historia corta, here's your solution:

$('#set-bg').click(function() { 
    $('#box').css('cssText', 'background: blue !important'); 
}); 

El autor afirma que:

Esto no es un error sino algo que doesn mayoría de los navegadores 's reconocer una necesidad ya que el estilo en línea ya tiene la prioridad más alta que el usuario definidos. (a menos que no desee su usuario para cambiar la forma en que ve su sitio web ).

Tenga en cuenta que el uso de cssText tiene una desventaja y es posible que desee considerar el uso de
cssRules lugar:

cssText se sobrescribe el css de ese elemento en particular. Por lo tanto, usted tendrá que volver a declarar la regla para ese elemento en particular en nuevamente.

Con todo lo dicho. Por favor, escucha Resumen del autor:

Usando importante en CSS no es aconsejable, ya que podría matar a su usabilidad web !. Además, no hay por lo que! Es importante utilizarlo ya que el estilo en línea ya tiene la prioridad más alta . Por lo tanto, es posible que desee reconsiderar la aplicación! Importante en su secuencia de comandos después de pensar en las consecuencias que podría comprar a los usuarios .

+0

¿No debería ser una llamada a ".attr()" en lugar de ".css()"? – Pointy

+0

No. Parece funcionar bien en Fx 4.0. Ver http://jsfiddle.net/ZsGXk/1/ – rubiii

+0

Wow eso es raro. OK entonces. – Pointy