jqMobi Team Switcher

by James Doyle

HTML

<script src="http://cdn.jqmobi.com/jq.mobi.min.js"></script>
<ul id="teamList">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

CSS

body { margin: 20px; }
ul {
    margin: 0;
    padding: 0;
}
ul li {
    height: 50px;
    width: 100px;
    margin: 5px 0;
    background: #333;
    -webkit-transition: -webkit-transform 0.2s ease;
}

JavaScript

function makeTeam() {
    for (var i=0; i<5; i++) {
        var x = i*10+'px';
        $("#teamList li").css('-webkit-transform','translate3d('+x+',0,0)');
    }
}
window.onload = function() {
    makeTeam();
}