Highlighting current and previous stars on mouseover
Posted
by
mpet
on Stack Overflow
See other posts from Stack Overflow
or by mpet
Published on 2014-08-18T14:41:14Z
Indexed on
2014/08/22
22:21 UTC
Read the original article
Hit count: 143
JavaScript
|jQuery
I'm trying to make simple five star rating system using Twitter Bootstrap 3 i jQuery. For now, I'm trying to set .hover() and .mouseout() events using counter by writing this code that doesn't work:
var i;
for (i = 1; i <= 5; i++) {
$('#overall_rating_' + i).hover(function(){
$('#overall_rating_' + i).removeClass("glyphicon-star-empty").addClass("glyphicon-star");
});
$('#overall_rating_' + i).mouseout(function(){
$('#overall_rating_' + i).removeClass("glyphicon-star").addClass("glyphicon-star-empty");
});
}
Trying to highlight current and previous stars on mouseover. The code is not complete, it would be accompanied by additional sub-counters, but this part doesn't work for now. Any better methods are welcome. What's broken here?
© Stack Overflow or respective owner
