采用Jq Css制作的五角星评分效果，主要是利用CSS的background-image以及background-position来调整我们的背景图片，以及Jq来选择要变化的元素。代码非常简单，只有几行。
Jq:
|
1
2
3
4
5
6
7
8
|
$(".formItemDiff").hover(function() {
$(this).css("background-position", "0px -555px");
$(this).prevAll().css("background-position", "0px -555px");
$(this).nextAll().css("background-position", "0px -575px");
$("#pointP").html($(this).prevAll().length 1 "分");
});
});
|
CSS:
|
1
2
3
4
5
6
7
8
|
.formItemDiff {
width: 20px;
height: 20px;
background-image: url(/wp-content/uploads/2014/10/220.png);
background-position: 0px -575px;
float: left;
margin-top: 15px;
}
|
