Ver Mensaje Individual
  #1 (permalink)  
Antiguo 10/01/2015, 05:41
LordYo
 
Fecha de Ingreso: julio-2014
Ubicación: España
Mensajes: 24
Antigüedad: 9 años, 10 meses
Puntos: 1
Pregunta ¿Se puede crear una notificación que desaparezca tras ciertos segundos sólo con css3?

¡Hola!

Pues he buscado por aquí y no veo lo que buscaba... Creo que con Javascript sí se puede, pero como siempre hay quien tiene bloqueado javascript, quisiera que fuese algo que todos pudiesen ver... La cosa sería la siguiente:

Estás en la página de edición de un artículo, por ejemplo. Lo editas, le das a guardar y te lleva a la página principal, donde le hemos enviado un parámetro para que muestre el mensaje de que se ha creado o se ha actualizado correctamente. Pues bien, me gustaría que esa notificación apareciese de repente(como lo hace ahora sin efecto) pero que al final acabe desapareciendo por completo, haciéndose transparente poco a poco y eliminando el espacio que ocupa cuando estaba. Es decir, sería cambiarle la transparencia y el tamaño... Sin que sea necesario que se le de click. Sopongo que, al igual que con el click, se usa el :after y/o el :before, pero ignoro en qué momento...

No sé si me he explicado bien, pero quisiera que empezase a hacerse transparente después de 5 segundos de haber cargado la página. Luego ya lo otro sería el tiempo que tarde en hacerse transparente del todo, que eso ya lo controlaría yo con la propiedad "duration" o algo así... .

Si fuese dándole click, no es tan difícil para mí. Pero quiero que sea automático... Un ejemplo:

TÍTULO
Notificación
CONTENIDO

A los pocos segundos empieza a desaparecer (5 segundos sin hacer nada, luego desaparece poco a poco), no quedaría así:


TÍTULO

CONTENIDO

Sino así:


TÍTULO
CONTENIDO

Creo que se entiende de sobra... ¡Un saludo, compañer@s!

De lo contrario, al menos que empiece a desaparecer muy lentamente ya nada más cargar...

Última edición por LordYo; 10/01/2015 a las 05:46 Razón: Aclaraciones y correcciones