这里只提供javascript和html,只供参考,没有例子下载看,我想只要有一些javascript和jquery基础的都能看懂吧。
jquery代码:
$(document).ready(function(){
$("#stars a").each(function(i){
$(this).mouseover(function(){
$("#stars a:lt("+(i+1)+")").attr("class","cur");
$("#stars a:gt("+i+")").removeClass("cur");
$("#isRank").attr("value",i+1);//把打的分数放到隐藏域
});
$(this).click(function(){
$("#isRank").attr("value",i+1);
});
$(this).mouseout(function(){
var cur_star = parseInt($("#isRank").val())-1;
$("#stars a:lt("+(cur_star+1)+")").attr("class","cur");
$("#stars a:gt("+cur_star+")").removeClass("cur");
$("#isRank").attr("value",i+1);//把打的分数放到隐藏域
});
})
});
html页面
<div class="area">
<div class="fixBox">
<label>评分:</label>
<div class="stars" id="stars">
<a href="javascript:void(0)" class="cur" id="star1" ></a>
<a href="javascript:void(0)" id="star2" ></a>
<a href="javascript:void(0)" id="star3" ></a>
<a href="javascript:void(0)" id="star4" ></a>
<a href="javascript:void(0)" id="star5" ></a>
</div>
<input type="hidden" value="1" id="isRank" />
<div class="clear"></div>
</div>
</div>
分享到:
相关推荐
用js特效制作星星打分效果适用于评论打分的js评分特效
仿淘宝星星评分效果-纯JS,
js特效星星打分效果适用于网站评论打分js星级评分效果
星星评分效果。鼠标滑过星星变色,点击时评分成功。
jquery点击星星打分效果代码
jquery星级评分特效制作电影视频网站滑动星星打分效果
jquery滑动星星评分效果代码
jquery 实现星星打分效果,利用jquery.raty.js, 需要的可以下载
简单的jquery滑动星星评分效果代码 简单的jquery滑动星星评分效果代码
实用的jquery星星评分效果代码是一款简单的jQuery滑动星星评分代码,鼠标滑到星星上高亮显示,点击评分效果代码。
基于jQuery的动态星星评分效果.zip
多种 星星评分效果 实现插件。有一颗星星为一个整体的例:仿淘宝的,也有半颗星星为一个整体的。
iOS的星星评分的效果
NULL 博文链接:https://xuedong.iteye.com/blog/1137713
本文实例讲述了js实现星星打分效果的方法。分享给大家供大家参考。具体分析如下: 很多网站都有如下图这样的星星打分效果,今天就看下用js怎么实现打分效果。 效果详解 1. 鼠标移上的时候星星点亮,下面的文字显示...
Jquey星星评分插件,包含实现DEMO。
主要为大家详细介绍了JavaScript实现简单的星星评分效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
jQuery星星打分评分插件是一款可支持修改图标样式,支持整数和小数打分,支持星星数量修改,支持图片大小修改,可自定义图片样式效果。