Интерактивная змея на HTML5

Исходный код этого примера:
<style>
    @keyframes wag {
        50% {
            transform: rotate(10deg);
        }
    }
    p.cc b {
        border-top: 1px solid #654321;
        border-radius: 10px;
        display: inline-block;
        width: 20px;
        height: 20px;
        background: #964b00;
        position: relative;
        top: 10px;
        transform: rotate(-10deg);
        animation-name: wag;
        animation-duration: 3s;
        animation-iteration-count: infinite;
        animation-timing-function: ease-in-out;
    }
    p.cc {
        display: block;
        height: 300px;
        margin-top: 50px;
        padding-left: 150px;
    }
</style>

<p class='cc'>
    <b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b><b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b></b>
</p>

Автор: http://bolknote.ru Sep 2012 Evgeny Stepanischev


.