CSS @keyframes-Animation funktioniert nicht. Wer kann helfen?
Ich habe eine class definiert:
die beispielsweise die id "#before-content4" hat das sind hübsche Boxen mit einem hover Effekt. (opacity von 0.6 auf 1)
Nun möchte ich dass diese Boxen noch eine fade-in DOWN Animation bekommen....ich weiß nur nicht wie ich das jetzt verwursten muss. Ich habe leider nicht so viel Ahnung von CSS wie ich gern hätte -.-
Der code dazu: .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
@-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } }
@keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0); } }
.fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; }