Skip to content

Instantly share code, notes, and snippets.

@csssecrets
Created September 29, 2014 04:58
Show Gist options
  • Save csssecrets/46fe09e5f2b97d6f282d to your computer and use it in GitHub Desktop.
Save csssecrets/46fe09e5f2b97d6f282d to your computer and use it in GitHub Desktop.
Blinking
/**
* Blinking
*/
@keyframes blink-1 { 50% { color: transparent } }
@keyframes blink-2 { to { color: transparent } }
p {
padding: 1em;
background: gold;
}
.blink-smooth-1 {
animation: 1s blink-1 3;
}
.blink-smooth-2 {
animation: .5s blink-2 6;
animation-direction: alternate;
}
.blink {
animation: 1s blink-1 3 steps(1);
}
<p class="blink-smooth-1">Peek-a-boo!</p>
<p class="blink-smooth-2">Peek-a-boo!</p>
<p class="blink">Peek-a-boo!</p>
// alert('Hello world!');
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment