Ich möchte das in bestimmten Fällen eine Messagebox für ein paar Sekunden angezeigt wird und dann selbst wieder verschwindet.
Hier mein Code:
Code:
<!DOCTYPE html>
<html>
<head>
<style>
.isa_success, .isa_error {
margin: 8px 0px;
padding:8px;
position: absolute;
left: 50%;
top: 20%;
transform: translate(-50%, -50%);
}
.isa_success {
color: #4F8A10;
background-color: #DFF2BF;
border-radius:.5em;
opacity:0;
-webkit-animation: fadeInOut 2s;
animation: fadeInOut 2s;
}
.isa_error {
color: #D8000C;
background-color: #FFD2D2;
border-radius:.5em;
opacity:0;
-webkit-animation: fadeInOut 2s;
animation: fadeInOut 2s;
}
</style>
</head>
<body>
<div class="isa_success">Replace this text with your own SUCCESS text.</div>
Test
</body>
</html>
Die Messagebox wird so gar nicht angezeigt. Sie soll aber angezeigt werden nachdem ein Button geklickt wurde.
Wie kann ich das umsetzen ?