Word Clock

HTML

<!-- http://www.instructables.com/id/DIGITAL-WORD-CLOCK-FROM-A-CHEAP-PHOTO-FRAME/ -->
<time>
    <b>IT</b>R<b>IS</b>U<b>HALF</b><b>TEN</b><br />
    <b>QUARTER</b><b>TWENTY</b><br />
    <b>FIVE</b>Q<b>MINUTES</b>T<br />
    <b>PAST</b>MEGANT<b>ONE</b><br />
    ONEN<b>TWO</b>Z<b>THREE</b><br />
    <b>FOUR</b><b>FIVE</b><b>SEVEN</b><br />
    <b>SIX</b><b>EIGHT</b>Y<b>NINE</b><br />
    <b>TEN</b>EL<b>EVEN</b>DOUG<br />
    <b>TWELVE</b>L<b>O<b class="apostrophe">'</b>CLOCK</b>
</time>

CSS

body {
    background-color: #000;
    font-family: monospace;
}

time {
    background:
        -webkit-radial-gradient(
            white,
            black
        );
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size:
        100px 50px;
    
    color: transparent;
    display: block;
    font-size: 48px;
    line-height: 0.8;
    margin: 50px;
    
    -webkit-background-clip: text;
}

time b {
    font-weight: normal;   
}

b.apostrophe {
    margin-left: -0.35em;
    margin-top: -0.1em;
    position: absolute;
    
    -webkit-transform: rotate( 15deg );
}

JavaScript

(function( $ ) {
    
    $( document ).ready(function() {
        var time = $( 'time' ),
            it = $( 'b:contains(IT)' );
        
        time.css( 'fake-property', 0 )
            .animate({
                'fake-property': 100
                }, {
                    step: function( i ) {
                        console.log( i );
                        time.css({
                            'background-position': ( i + 'px ' + i + 'px' )
                        });
                    }
                });
    });
    
})( jQuery );