jquery2014-09-17 17:35:45 13437
采用Jq Css制作的五角星评分效果,主要是利用CSS的background-image以及background-position来调整我们的背景图片,以及Jq来选择要变化的元素。代码非常简单,只有几行。
Jq:
$(".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:
.formItemDiff { width: 20px; height: 20px; background-image: url(http://www.pengyaou.com/food/Images/diff.png); background-position: 0px -575px; float: left; margin-top: 15px; }
彭亚欧个人博客原创文章,转载请注明出处
文章关键词:Jquery五角星打分效果,Jquery评分效果,Jq评分插件
文章固定链接:https://www.pengyaou.com/legendsz/front/codejq/MzM=.html
上一篇 PHP基础