Turn number rating into stars.
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<meta charset=utf-8 />
<title>Star Rating</title>
<script>
$.fn.stars = function() {
return this.each(function(i,e){$(e).html($('<span/>').width($(e).text()*16));});
};
$('.stars').stars();
</script>
<style>
span.stars, span.stars>* {
display: inline-block;
background: url(http://i.imgur.com/YsyS5y8.png) 0 -16px repeat-x;
width: 80px;
height: 16px;
}
span.stars>*{
max-width:80px;
background-position: 0 0;
}
</style>
</head>
<body>
Rating: <span class="stars">4</span>
</body>
</html>