Search code examples
jquerycssrating

how to get rating value dynamically


I've using a rating system on my webpage. I've used this jQuery plugin for it. This is my fiddle. I want, rating number(for example, 2 out of 5 or 2/5 which is located right side of my jiddle) will also be changed at the time of changing star rating just like imdb.com. How can I make this?

jQuery:

$('.starbox').starbox({
    average: 0.42,
    autoUpdateAverage: true,
    ghosting: true
});

Solution

  • Can you check this one? Here the right line is updated on hover, and when you leave the star, it put back the initial value corresponding to the highlighted stars

    $('.starbox').starbox({
        average: 0.4,
        autoUpdateAverage: true,
        ghosting: true
    });
    
    $('.star').hover(function() {
        var currentHoveredNote = parseInt($(this).attr('class').replace("star star-", "")) + 1;
        $(this).closest(".block").find(".rating-value p").text(currentHoveredNote + '/5');
    }, function() {
        $(this).closest(".block").find(".rating-value p").text(parseFloat($(this).closest(".starbox").starbox("getOption", "average")) * 5 + '/5');
    });
    

    http://jsfiddle.net/565LK/12/