$(document).ready(function() {

    $(".star_ratings.clickable").mousemove(function(e) {
        pos = findPos(this); // gets the offset left position of the HOVERED element
        width = e.pageX - pos[0]; // Subtracts the mouse location from the hovered element.

        new_width = (Math.round((width + 2.5) / 9.5)) * 9.5 - 2.5
        if (new_width <= 3.5) { new_width = 0 }

        $(this).find("div").css("width", new_width + "px");

        //printd(width + "  - " + new_width);
    });

    $(".star_ratings.clickable").mouseout(function(e) {

        orig_width = $(this).siblings("input").val();
        $(this).find("div").css("width", orig_width + "px");

    });

    $(".star_ratings.clickable").click(function(e) {

        $(this).siblings("input").val($(this).find("div").css("width").replace("px",""));

    });
});




function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		do {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		} while (obj = obj.offsetParent);
	}
	return [curleft,curtop];
}
