out animation

This commit is contained in:
troy 2022-11-08 18:36:15 +01:00
parent 1764bbaa24
commit 5f60054c1f
2 changed files with 22 additions and 12 deletions

View File

@ -9,23 +9,31 @@ flogelem {
display:block;
border-width: 1px;
border-style: solid;
border-radius: 8px;
overflow: hidden;
max-height: 0;
margin-bottom: 0;
padding: 0;
opacity: 0;
-webkit-transition: max-height 3s, margin-bottom 3s, padding 3s,opacity 3s;
-moz-transition: max-height 3s, margin-bottom 3s, padding 3s,opacity 3s;
transition: max-height 3s, margin-bottom 3s, padding 3s,opacity 3s;
position: relative;
bottom: 0;
-webkit-transition: max-height 3s, margin-bottom 3s, padding 3s,opacity 3s, bottom 3s;
-moz-transition: max-height 3s, margin-bottom 3s, padding 3s,opacity 3s, bottom 3s;
transition: max-height 3s, margin-bottom 3s, padding 3s,opacity 3s, bottom 3s;
}
.flshow {
max-height: 100px!important;
max-height: 200px!important;
margin-bottom: 1em;
padding: 4px;
border-radius: 8px;
opacity: 1;
}
.flvanish {
position: relative;
bottom: 3em;
max-height: 0 !important;
opacity: 0 !important;
}
fltitle {
display: block;

View File

@ -4,13 +4,15 @@ let frontlog = document.createElement('frontlog');
document.body.appendChild(frontlog);
let frontlogVanish = function(elem) {
elem.remove();
//TODO irgendwann hübscher machen
let elems = document.getElementsByTagName('flogelem');
if(elems.length < frontlogMaxEl && frontlogList.length) {
let p = frontlogList.shift();
frontlogPipe(p.title,p.icon,p.msg,p.col,p.time);
}
elem.classList.add('flvanish');
setTimeout(function() {
elem.remove();
let elems = document.getElementsByTagName('flogelem');
if(elems.length < frontlogMaxEl && frontlogList.length) {
let p = frontlogList.shift();
frontlogPipe(p.title,p.icon,p.msg,p.col,p.time);
}
},3100);
}
let frontlogAdd = function(title,icon,msg,col,time) {