¿Hay alguna manera de que pueda usar CSS3 para fundirse y salir un fondo blanco sólido de <div>? el contenido debe permanecer visible para que solo el fondo se desvanezca.Hacer fundido de fondo/
¿Alguna idea sobre el uso de las transiciones/transformaciones css3?
gracias por su ayuda.
Claro, usted puede utilizar el transition property directamente en la background-color:
div {
background-color: white;
/* transition the background-color over 1s with a linear animation */
transition: background-color 1s linear;
}
/* the :hover that causes the background-color to change */
div:hover {
background-color: transparent;
}
Aquí es an example de un fondo rojo desvanecimiento en :hover.
Puede resultar útil para ejemplos de imagen y color de fondo se desvanece: - http://nettuts.s3.amazonaws.com/581_cssTransitions/demos.html
Sin embargo el uso de CSS 3 para hacer la transición va a limitar el efecto de los navegadores que no soportan.
enfoque muy agradable, +1 para una buena orientación – doniyor
Puede tener dos divs en un contenedor div. El primer div contiene el fondo blanco, el segundo obtiene el contenido.
A continuación, utilice una transformación CSS3 para animar la opacidad del primer div a cero.
Gracias por la sugerencia. Finalmente coloqué el primer color en línea en el div y el segundo color (es decir, blanco) externo como color de fondo: blanco! Importante; así como la propiedad de transición. – Frank
No sabía que realmente podría animar el color de fondo. Creo que es mucho mejor que mi solución :) – Husky
@Husky Las transiciones son bastante excelentes, pero estoy ansioso por saber cuándo podemos descartar todos los prefijos específicos del navegador. – Pat
podrías usar LESS/SASS y usar los mixins allí. Al menos lo hace soportable si está usando muchas propiedades de CSS3. – Husky