Skip to content

Instantly share code, notes, and snippets.

@Shipow
Created September 2, 2013 13:26
Show Gist options
  • Save Shipow/6412849 to your computer and use it in GitHub Desktop.
Save Shipow/6412849 to your computer and use it in GitHub Desktop.
Sass Facebook loading style
=animation($name,$value)
-webkit-animation-#{$name}: $value
animation-#{$name}: $value
=keyframes($name)
@-webkit-keyframes #{$name}
@content
@-moz-keyframes #{$name}
@content
@-ms-keyframes #{$name}
@content
@-o-keyframes #{$name}
@content
@keyframes #{$name}
@content
.data_loading
width: 20px
margin: 0 auto
.lb
background-color: #eee
float: left
height: 14px
margin-left: 1px
width: 4px
opacity: 0.1
+animation(name,bounceG)
+animation(duration,0.7s)
+animation(iteration-count,infinite)
+animation(direction,linear)
+scale(0.7)
&.lb1
+animation(delay,0.20999999999999996s)
&.lb2
+animation(delay,0.27999999999999997s)
&.lb3
+animation(delay,0.35s)
+keyframes(bounceG)
0%
+opacity(1)
+scale(1.2)
100%
+scale(0.7)
+opacity(0.1)
@vAugagneur
Copy link

awesome !!!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment