Css auto hide div через 5 секунд
With the below CSS i am trying to hide the div after 5 seconds. But it works only with Chrome. Problem: It will not work with IE and Firefox, It will hide the div but space remains. please help.
Что я уже пробовал:
<div class="success">Successfully saved</div>
.success {
-webkit-animation: seconds 1.0s forwards;
-webkit-animation-iteration-count: 1;
-webkit-animation-delay: 5s;
animation: seconds 1.0s forwards;
animation-iteration-count: 1;
animation-delay: 5s;
position: relative;
}
@-webkit-keyframes seconds {
0% {
opacity: 1;
}
100% {
opacity: 0;
left: -9999px;
position: absolute;
}
}
@keyframes seconds {
0% {
opacity: 1;
}
100% {
opacity: 0;
left: -9999px;
position: absolute;
}
}
Mohammed_Faisal_Majeed
Для вашей справки пожалуйста найдите ниже CSS:
<div class="success">Successfully saved</div>
.info, .success, .warning, .error, .validation {
-webkit-animation: seconds 1.0s forwards;
-webkit-animation-iteration-count: 1;
-webkit-animation-delay: 5s;
animation: seconds 1.0s forwards;
animation-iteration-count: 1;
animation-delay: 5s;
position: relative;
}
@-webkit-keyframes seconds {
0% {
opacity: 1;
}
100% {
opacity: 0;
left: -9999px;
position: absolute;
}
}
@keyframes seconds {
0% {
opacity: 1;
}
100% {
opacity: 0;
left: -9999px;
position: absolute;
}
}
F-ES Sitecore
Согласно с этот вам нужно определить его для каждого браузера, поскольку они, похоже, поддерживают разный синтаксис.
Richard Deeming
Похоже, это старая статья. Согласно с Могу ли я использовать[^], Chrome не нуждался в -webkit- префикс с v43; Firefox не нуждался в -moz- префикс начиная с v16; Edge, IE10 и IE11 не нуждаются в префиксе; а IE9 и ниже вообще не поддерживают CSS-анимацию. :)