CSS Animation (for UBelly)

by stopsatgreen

HTML

<div>
    <h1>Hello!</h1>
</div>

CSS

@-moz-keyframes speedy {
    from {
        -moz-transform: skew(45deg) translateX(-100%);
    }
    70% {
        -moz-transform: skew(45deg);
    }
    80% {
        -moz-transform: skew(-30deg);
    }
    90% {
        -moz-transform: skew(15deg);
    }
    to {
        -moz-transform: none;
    }
}

@-moz-keyframes chameleon {
    from { opacity: 0; }
    to { opacity: 1; }
}

h1 {
    -moz-animation: chameleon 525ms linear 1, speedy 750ms linear 1;
    font: bold 400%/1 sans-serif;
    text-align: center;
}