jquery-ui-dialog usa una div superpuesta para diálogos modales. El div tiene este estilo:¿Por qué jquery-ui-dialog usa un color de fondo e imagen para la superposición?
.ui-widget-overlay {
background: #AAA url(images/ui-bg_flat_75_aaaaaa_40x100.png) 50% 50% repeat-x
opacity: 0.3;
}
¿Por qué se especifica tanto el color de fondo y la imagen? ¿Por qué no solo un color?
Creo que es es más seguro aplicar siempre un color junto con la imagen de fondo.
El navegador no podría admitir el formato png, o la solicitud de la imagen podría fallar (por la razón que sea).
El color por otro lado siempre se aplicará. Lo ven como una especie de plan de copia de seguridad :-)
Editar:
En realidad no requieren un archivo de imagen para simplemente crear una capa semitransparente de color. Solo background-color y opacity son suficientes.
Creo que la razón exacta es que jQuery UI permite aplicar texturas (se puede elegir ellos o desactivarlos en la aplicación ThemeBuilder en el sitio web jQuery UI. Es por esto que se utiliza la imagen, incluso cuando no se selecciona la textura . sin textura es en realidad la textura "plana" se puede ver que en el nombre del archivo de imagen:.
ui-bg_flat_75_aaaaaa_40x100.png
si se aplica el "blanco-líneas" textura a la superposición en el ThemeBuilder, se genera archivos de imagen con este nombre:
ui-bg_ blancas líneas _75_aaaaaa_40x100
La primera parte de la respuesta sigue siendo válida, pero esta es más la razón principal en el caso de jquery ui.
Sólo una conjetura, pero tal vez es para navegadores antiguos que carecen de apoyo PNG o único apoyo 'parcial' para el efecto que queremos lograr, o para aquellos que se olvidan de copiar las imágenes a través de
Lo que tiene es la propiedad abreviada de CSS para establecer el fondo. También puede escribir:
background-color: #AAA;
background-image: url(images/ui-bg_flat_75_aaaaaa_40x100.png);
background-position: 50% 50%;
background-repeat: repeat-x;
Como el color es el primer parámetro en la versión abreviada, debe especificarse. Tiene efecto si, por ejemplo,
Si sólo desea especificar un color, puede hacer esto:
background-color: #AAA;
o que (la versión abreviada con un solo parámetro):
background: #AAA;
los otros parámetros se establecería en el valor predeterminado entonces. Si desea que la misma expresseion pero sin la imagen, puede hacerlo de esta manera:
background: #AAA none 50% 50% repeat-x;
Here's una explicación bastante decente de este tema.
es probable que haya otra explicación, ya que también podrían definir 'background: inherit url (...' or 'background: url transparente (...' si quisieran ignorar el color. – kontur
@kontur Eso es correcto, pero ambos 'inherit' y' transparent' son valores válidos para 'color'-property. – Quasdunk
Creo que puede elegir fondos png semitransparentes para sus widgets cuando cree descargas personalizadas de jquery ui. Por lo tanto, es importante que las partes transparentes tengan color debajo.
Editar: Es decir, el generador de temas está diseñado para incluir siempre un color y un png, y para seguir con estos esquemas, incluye un png de color sólido si su textura es sólida, en lugar de a cuadros o a rayas opciones de degradado.
ver la diferencia entre:
¿Cómo funcionaría eso de forma diferente a un color con opacidad? – ripper234
No puede codificar rayas o cuadros con opacidad. Digamos que seleccionaría rojo - bien, jqueryui te construye una declaración de fondo con un color rojo sólido y un rojo png. Pero si especificas las fichas rojas, jqueryui te construye una declaración de fondo con un color rojo sólido y un png con verificadores semitransparentes. Por eso hay una definición "doble" en el caso de un color sólido. [consulte los enlaces que agregué a la respuesta] – kontur
Por qué no sólo un color? – ripper234
Oh sí, tiene sentido. Todavía no jugué con texturas, así que no pensé en eso. – ripper234