Star Rating Using Select Dropdown Box - Version 2
by bizamajig
HTML
<script src="http://www.jhwebdesigner.com/rating-system/rating-system/jquery.js"></script>
<link rel="stylesheet" href="http://www.jhwebdesigner.com/rating-system/rating-system/rating_simple.css">
<select name="my_input" id="rating_simple">
<option value="0" selected="selected"></option>
<option value="1">Poor</option>
<option value="2">Below Average</option>
<option value="3">Average</option>
<option value="4">Good</option>
<option value="5">Excellent</option>
</select>
JavaScript
(function (a) {
a.fn.webwidget_rating_simple = function (p) {
var p = p || {};
var b = p && p.rating_star_length ? p.rating_star_length : "5";
var c = p && p.rating_function_name ? p.rating_function_name : "";
var e = p && p.rating_initial_value ? p.rating_initial_value : "";
var d = p && p.directory ? p.directory : "images";
var f = "";
var g = a(this);
b = parseInt(b);
init();
g.change(function(){var r = a(this).val()-1;f=""; g.next('ul').children('li').eq(r).trigger('mouseenter');f=r+1; g.next('ul').children('li').eq(r).trigger('mouseenter').trigger('mouseleave')});
g.next("ul").children("li").hover(function () {
$(this).parent().children("li").css('background-image', 'url(' + d + '/nst.gif)');
var a = $(this).parent().children("li").index($(this));
$(this).parent().children("li").slice(0, a + 1).css('background-image', 'url(' + d + '/sth.gif)');
}, function () {});
g.next("ul").children("li").click(function () {
var a = $(this).parent().children("li").index($(this));
f = a + 1;
alert(f);
g.val(f);
if (c != "") {
eval(c + "(" + g.val() + ")")
}
});
g.next("ul").hover(function () {}, function () {
if (f == "") {
$(this).children("li").css('background-image', 'url(' + d + '/nst.gif)').css('background-color', '#0f0')
} else {
$(this).children("li").css('background-image', 'url(' + d + '/nst.gif)').css('background-color', '#0f0');
$(this).children("li").slice(0, f).css('background-image', 'url(' + d + '/sth.gif)').css('background-color', '#f00')
}
});
function init() {
$('<div style="clear:both;"></div>').insertAfter(g);
g.css("float", "left");
var a = $("<ul>");
...