[Résolu] Limiter la durée d'affichage d'une DIV

Bonjour,

Je cherche à limiter la durée d’affichage d’une DIV à quelques secondes, soit par CSS ou par Javascript.
Mes recherches n’ont rien données.
J'ai trouvé des choses pour retarder un affichage mais rien pour en fixer la durée.
Auriez-vous une idée pour m’aiguiller.

Merci par avance
Patrick MARA

Salut,

Tu veux juste la masquer visuellement ou carrément la faire disparaître du DOM ?

Si juste visuellement tu peux t'arranger avec une petite anim CSS :

.coucou {
  background: red;
  animation-name: disparaitre;
  animation-duration: 2s;
    opacity:0;
}

@keyframes disparaitre {
  from {
    opacity:1;
  }
  to {
    opacity:1;
  }
}

https://jsfiddle.net/undless/zyhn6ag1/3/


Sinon faudra faire un peu de Js je pense.

Bonjour,

Merci pour votre aide.
J'ai testé votre code et cela fonctionne.

.retour {
 background-color :  yellow;
 border: solid 0.2em #CCCCCC;
 padding :0.25em; 
 animation-name: disparaitre;
 animation-duration: 2s;
 opacity:0;
}
@keyframes disparaitre {
  from {
    opacity:1;
  }
  to {
    opacity:1;
  }
}  

Juste un petit bémol, une ligne blanche fait place à l'affichage, mais je ferai avec dans l'attente d'une solution qui fasse disparaître cette ligne, sur laquelle vous avez peut être une idée, je ne suis pas un as en javascript.

Bien cordialement
Patrick MARA

Bonjour,

J'ai finalement trouvé la solution, il suffit de supprimer (remove) la DIV id retour avec un temps de retard (setTimeout).

setTimeout(function(){$('#retour').remove();}, 2000);

Bien cordialement
Patrick MARA