Skip to content

Instantly share code, notes, and snippets.

@davechu
Created July 30, 2014 23:04
Show Gist options
  • Save davechu/dea3cf4903a907b9944d to your computer and use it in GitHub Desktop.
Save davechu/dea3cf4903a907b9944d to your computer and use it in GitHub Desktop.
For Ren. A CSS3 way to fade something out. Obviously change it to your selector. :-)
/***********************************************************************
The trick is to have the "last state" defined first. Otherwise, it fades and then reappears!
If you are fading in, this isn't needed, because default is "in". :)
************************************************************************************/
.entry-title {
opacity: 0;
-webkit-animation: fading 5s; /* Chrome, Safari, Opera */
animation: fading 5s;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes fading {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
/* Standard syntax */
@keyframes fading {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment