Im Social Network Facebook gibt es einen Fadeeffekt mit gelben Hintergrund bei neuen Beiträgen der sich nach wenigen Sekunden ausblendet, dieses kann man auch für das WSC 3 umsetzen mit folgenden Code (der CSS-Definition des Stils hinzufügen):
Code
/* ====================================================== New Entry Background Fade Effect by Gino Zantarelli */
.tabularListColumns.messageGroup.wbbThread.jsClipboardObject.new {
-webkit-animation-name: fadeout; /* Chrome, Safari, Opera */
-webkit-animation-duration: 6s; /* Chrome, Safari, Opera */
animation-name: fadeout;
animation-duration: 6s;
-webkit-animation-delay: 1s; /* Chrome, Safari, Opera */
animation-delay: 1s;
}
@keyframes fadeout {
from {background-color: #FFFFC8;}
to {background-color: $wcfContentBackground;}
}
@-moz-keyframes fadeout {
from {background-color: #FFFFC8;}
to {background-color: $wcfContentBackground;}
}
@-webkit-keyframes fadeout {
from {background-color: #FFFFC8;}
to {background-color: $wcfContentBackground;}
}
@-o-keyframes fadeout {
from {background-color: #FFFFC8;}
to {background-color: $wcfContentBackground;}
}Die Zeit wie lange es dauern soll den Farbhintergrund auszublenden kann man hier anpassen:
Code
animation-duration: 6s;
-webkit-animation-duration: 6s; /* Chrome, Safari, Opera */Die Wartezeit BEVOR der Effekt anfangen soll kann hier angepasst werden:
Code
-webkit-animation-delay: 1s; /* Chrome, Safari, Opera */
animation-delay: 1s;So sieht es aus mit Farbhintergrund: