flyLabel.js

Classic

.classic {
  opacity: 0;
  top: 2em;
  z-index: -1;
}
.classic.is-active {
  opacity: 1;
  top: 1em;
  z-index: 1;
}
            

Drop

.drop {
  opacity: 0;
  text-shadow: 0 0 25px blue;
  transform: scale(11);
  z-index: -1;
}
.drop.is-active {
  opacity: 1;
  text-shadow: 0 0 0 blue;
  transform: scale(1);
  z-index: 1;
}
            

From Right

.from-right {
  left: 5em;
  opacity: 0;
}
.from-right.is-active {
  left: 0%;
  opacity: 1;
}
            

Jiggle

.jiggle.is-active {
  animation: JIGGLE .3s ease;
  animation-iteration-count: 3;
}
            

Select

.classic {
  opacity: 0;
  top: 2em;
  z-index: -1;
}
.classic.is-active {
  opacity: 1;
  top: 1em;
  z-index: 1;
}