Font-awesome: Icon Request: blinking effect
The spinning icon has an amazing effect, but I believe it will be useful a blinking (fade in/ fade out) effect for signaling events in the interface. This could be done with transparency, using CSS3 transformations.
Sample:
@keyframes fa-blink {
0% { opacity: 1; }
25% { opacity: 0.25; }
50% { opacity: 0.5; }
75% { opacity: 0.75; }
100% { opacity: 0; }
}
.fa-blink {
-webkit-animation: fa-blink .75s linear infinite;
-moz-animation: fa-blink .75s linear infinite;
-ms-animation: fa-blink .75s linear infinite;
-o-animation: fa-blink .75s linear infinite;
animation: fa-blink .75s linear infinite;
}
BTW, great job!
opalenzuela
👍32
🚀3
All 16 comments
Well done, mate!
ycliuhw
on 1 Jul 2015
+1
tradzik
on 23 Jan 2016
+1
Sherif-Ahmed
on 4 Jun 2016
+1
LaloHD
on 5 Jul 2016
+1
JefMari
on 25 Aug 2016
+1
enreeco
on 7 Sep 2016
👍1
well done
govindarajumekala
on 15 Oct 2016
+1
glaubervila
on 24 Jan 2017
+1
adrianopedro
on 21 Apr 2017
+1
little note: the 0.25 and 0.75 are misplaced
Tonakka
on 26 Apr 2017
👍6
+1
lickmydesign
on 4 Jan 2018
+1
Zaczero
on 9 May 2018
+1
mskovacic
on 11 Sep 2018
+1
branc116
on 24 Oct 2018
+1
MichaelSamteladze
on 12 Feb 2019
+1
xeizer
on 28 Mar 2020
Was this page helpful?
0 / 5 - 0 ratings
Related issues
yarcowang
路
3Comments
seppestas
路
3Comments
brystfire08
路
3Comments
desspro
路
3Comments
jakuuub
路
3Comments
Most helpful comment
+1
little note: the 0.25 and 0.75 are misplaced