<!DOCTYPE HTML>
<html>
<head>
<script>
var idUser = 18678,
starWidth = 20,
coords, stars,
razn = 500,
put = ["vote_kult", "vote_humor"],
rate = [{vote: 5, rating: '74%'}, {vote: 5, rating: '84%'}];
$(function() {
$('.rating').each(function(i, e) {
$(e).find(".ratDone").width(rate[i].rating)
.end()
.parent().find(".ratStat").html("Оценили: <strong>"+rate[i].vote+"</strong><span class='st-people'></span>")
}).mousemove(function(e){
var o = $(this);
coords = e.clientX - o.offset().left;
stars = Math.ceil(coords/starWidth);
o.find(".ratHover").width(stars*starWidth).attr("title", stars+" из 10")
}).mouseout(function(){
$(this).find(".ratHover").width(0)
}).click(function(){
var o = $(this);
$.ajax({
type: "GET",
url: "php/vote/action.php",
data: {"id": idUser, "rating": stars},
cache: false,
success: function(response){
if(response == 1){
o.find(".ratHover").hide();
o.find(".ratDone").animate({width: stars*starWidth},razn);
o.parent().find(".ratBlocks").show()
.next().html("Вы поставили: <strong>"+stars+"</strong>");
} else o.parent().find(".ratStat").text(response)
}
})
});
});
</script>
</head>
<body>
<div id="stats">
<div class="ratingBar">
<div class="rat-ic" title=""></div>
<div class="rat-st">86%</div>
<div class="rating">
<div class="ratZero"></div>
<div class="ratDone"></div>
<div class="ratHover"></div>
</div>
<div class="ratBlocks"></div>
<div class="ratStat"></div>
</div>
<div class="ratingBar">
<div class="rat-ic" title=""></div>
<div class="rat-st">86%</div>
<div class="rating">
<div class="ratZero"></div>
<div class="ratDone"></div>
<div class="ratHover"></div>
</div>
<div class="ratBlocks"></div>
<div class="ratStat"></div>
</div>
</div>
</body>
</html>