需要引入的js

	<script type="text/javascript" src="<%=basePath%>resources/js/jquery.min.js"></script>
<script type="text/javascript" src="<%=basePath%>resources/js/jquery.raty.js"></script>

需要的图片

具体使用:

在需要显示星级的地方加一个div

<div id="star" data-num="3.5"></div>

在script中初始化

         $(function(){
$("#star").raty({
score:function(){
return $(this).attr("data-num");
},
starOn:'resources/img/star-on-big.png',
starOff:'resources/img/star-off-big.png',
starHalf:'resources/img/star-half-big.png',
readOnly:false,
halfShow:true,
size:34, })
});

score:需要显示的星星个数

starOn:鼠标放上去时显示的图标的位置

starOff:鼠标离开后显示的图标的位置

starHalf:需要显示的半星的标图的位置

readOnly:所显示的星星是否只读,默认非只读

halfShow:半个星星是否可以显示,默认可以

size:div显示的长度,太短了星星会换行

星星显示的效果如下:

jquery 星级评价插件jquery Raty的使用的更多相关文章

  1. jQuery图片延迟加载插件jQuery.lazyload

      插件描述:jQuery图片延迟加载插件jQuery.lazyload,使用延迟加载在可提高网页下载速度.在某些情况下,它也能帮助减轻服务器负载. 使用方法 引用jquery和jquery.lazy ...

  2. jQuery瀑布流插件——jQuery.Waterfall

    插件--jQuery.Waterfall 思路: 其实只要了解了整个流程,要实现这个插件也不难,大家都玩过俄罗斯方块吧,原理差不多,找到合适的地方叠上去就好了,在这里,每个块的宽度是必需给定的,然后计 ...

  3. jquery上传插件Jquery.uploadify.js-转

    Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示.不过官方提供的实例时php版本的,本文将详细介绍Uploadify在Aspnet中的使用,您也可以点击下面的链接进行演示 ...

  4. jQuery图片切换插件jquery.cycle.js

    Cycle是一个很棒的jQuery图片切换插件,提供了非常好的功能来帮助大家更简单的使用插件的幻灯功能 下载cycle插件并引入,此时,注意把引入它的代码放在引入jQuery主文件之后. <he ...

  5. Jquery中日期插件jquery.datepick的使用

    jsp的代码: <%@ page language="java" contentType="text/html; charset=UTF-8" pageE ...

  6. jQ效果:jQuery时间轴插件jQuery Timelinr

    前言 这是一款可用于展示历史和计划的时间轴插件,尤其比较适合一些网站展示发展历程.大事件等场景.该插件基于jQuery,可以滑动切换.水平和垂直滚动.支持键盘方向键.经过扩展后可以支持鼠标滚轮事件. ...

  7. jquery图片切换插件jquery.cycle.js参数详解

    转自:国人的力量 blog.163.com/xz551@126/blog/static/821257972012101541835491/ 自从使用了jquery.cycle.js,我觉得再也不用自己 ...

  8. jQuery星级评分插件

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta http-equiv="Con ...

  9. jQuery回到顶部插件jQuery GoUp

    插件描写叙述 jQuery GoUp!是一个简单的jQuery插件,让你的网页用户直接回到顶部. 用法很easy 引用jquery库和jquery.goup.min.js到你的页面 <scrip ...

随机推荐

  1. 编写输出Hellow word!

    打开java运行环境(eclipse),然后输入以下语句,点击编译运行后即可输出“Hello World,”. public class HelloWorld { public static void ...

  2. RF学习使用记录【4】

    四 Extending Robot Framework 4.1 Creating test libraries RF的测试能力由测试库支持决定,已经有许多的测试库,有一些随着RF框架安装,但是更多的需 ...

  3. Problem 25

    Problem 25 The Fibonacci sequence is defined by the recurrence relation: Fn = Fn−1 + Fn−2, where F1 ...

  4. Ribbon 负载均衡

    一.是什么 Spring Cloud Ribbon 是基于 Netfix Ribbon 实现的一套客户端(服务的消费者)负载均衡的工具 二.用法 服务消费者工程的 pom.xml 添加如下内容 < ...

  5. PHP扩展开发-测验成功

    原文:http://kimi.it/496.html http://blog.csdn.net/u011957758/article/details/72234075 ---------------- ...

  6. Ruby 读取文件

    Ruby 读取文件 一次全读出来 textAll = File.read("fileName.txt") puts textAll 一次读取一行 file = File.open( ...

  7. pl/sql developer 自动输入替换 光标自动定位

    pl/sql developer 自动输入替换 工具->首选项->用户界面->编辑器->自动替换,自己定义一些规则,然后输入key,点击tab或者空格,就可以进行替换了: SL ...

  8. STM32的IO配置点灯

    1.led.c的详细的代码: /*----------------------------------------------------------*/ #include "led.h&q ...

  9. 去掉文本框前后的空格(JS+JQuery)

    表单验证时,需要去除文本框前后的空格才可以正确通过验证.以前看到过一句话:任何设计和代码都要对用户足够宽容. <input type="text" class="p ...

  10. Codeforces Round #200 (Div. 2)D. Alternating Current (堆栈)

    D. Alternating Current time limit per test 1 second memory limit per test 256 megabytes input standa ...