Coderwall Scroll

by beckje01

HTML

<div class="holder">
    <div class="coderwall">

    </div>
</div>

CSS

.holder
{
  height:75px;
  width:75px;  
  overflow:hidden;        
}

.coderwall
{
    position:relative;
    width:75px
}

CoffeeScript

count=0
showing=0

nextBadge = -> 
  showing++
  if(showing==count)
    $('.coderwall').css('top','0px');
    showing=0
  else
    $('.coderwall').animate({top: -80 * showing}, 1000)



setInterval(nextBadge, 10000)
 
    
$.getJSON "http://www.coderwall.com/aslakhellesoy.json?callback=?", (data) ->
  $('.coderwall').empty()
  count=data.data.badges.length
  for item in data.data.badges
    $("<img>")
    .attr(
      src:    item.badge
      float:  "left"
      title:  "#{item.name}: #{item.description}"
      alt:    item.name
      height: 75
      width:  75
    )
    .appendTo($('.coderwall'))