Text animation- every other random

by Victor

HTML

<div class="name">The Smiths</div>

CSS

.name {
    text-align: center;
    padding:100px;
}
.letterWrap {
    /*border:1px solid red;*/
    position: relative;
    top:0;
    font-size: 30px;
}

JavaScript

//break the words
    var thing = $('.name').text().split("");
//clear it
    $('.name').html('');
//put the new contained letters back in
    for (var i = 0; i < thing.length; i++) {
        var elm = "<span class='letterWrap'>" + thing[i] + "</span>";

        $('.name').append(elm);
    };

 $('.letterWrap').css({
                      "position":"relative",
                      "top": getRand(-200,200) + "px"
                  });



              $('.letterWrap').each(function(i){
                 
              
	if (i%2 == 0)
    {
                $(this).delay(100 * i).animate({
            "top": "-40px"
        },200).animate({
            "top": "0px"
        },200);
    }
	else
    {
                $(this).delay(100 * i).animate({
            "top": "40px"
        },200).animate({
            "top": "0px"
        },200);
    }
                  


    });

function getRand(min, max) {
    return Math.random() * (max - min) + min;
};