需要引入的js

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

需要的图片

具体使用:

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

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

在script中初始化

  1. $(function(){
  2. $("#star").raty({
  3. score:function(){
  4. return $(this).attr("data-num");
  5. },
  6. starOn:'resources/img/star-on-big.png',
  7. starOff:'resources/img/star-off-big.png',
  8. starHalf:'resources/img/star-half-big.png',
  9. readOnly:false,
  10. halfShow:true,
  11. size:34,
  12.  
  13. })
  14. });

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. 在 Linux 下判断系统当前是否开启了超线程

    转自: http://www.cnblogs.com/wjoyxt/p/4804293.html #lscpu Thread(s) per core: 2 Core(s) per socket: 6 ...

  2. Linux C(day01)

    Linux是一个和Windows类似的操作系统 通常通过终端软件使用Linux操作系统 终端软件里只能使用键盘不能使用鼠标 可以在终端软件里输入各种命令控制计算机 完成各种任务 clear命令可以清除 ...

  3. docker 容器操作( 以 tomcat 为例 )

    一.容器操作 一个镜像可以启动多个容器.比如一个 tomcat 镜像,可以启动多个tomcat 容器,启动后的这些 tomcat 都是各自独立的 二.步骤 1.搜索镜像 [root@localhost ...

  4. 如何用PYTHON的CGIHTTPSERVER模块模拟POST请求?

    这次又要逼真一点点,可以弄POST请求啦. 在WEB根目录下新建cgi-bin目录(据说是规模要求),然后运行命令: python -m CGIHTTPServer CGI-BIN目录下,form.p ...

  5. codevs——T1043 方格取数

    http://codevs.cn/problem/1043/  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 钻石 Diamond 题解  查看运行结果     题目描述 De ...

  6. magento 的一些Sql查询

    1,模拟使用getName()获取产品名称的sql SELECT `value` AS product_name FROM yo_catalog_product_entity_varchar WHER ...

  7. UVA Jin Ge Jin Qu hao 12563

    Jin Ge Jin Qu hao (If you smiled when you see the title, this problem is for you ^_^) For those who ...

  8. 一个表空间使用率查询sql的优化

    话不多说,直接上运行计划: SQL> set lines 500; SQL> set pagesize 9999; SQL> set long 9999; SQL> selec ...

  9. HTTP详解工作原理

    1. HTTP简介 HTTP协议(HyperText Transfer Protocol,超文本传输协议)是用于从WWW服务器传输超文本到本地浏览器的传送协议.它可以使浏览器更加高效,使网络传输减少. ...

  10. 在Windows 8.1系统上配置免安装版mysql-5.6.21-winx64

    1.到官网上下载MySQL 下载地址为:http://cdn.mysql.com/Downloads/MySQL-5.6/mysql-5.6.21-winx64.zip 2.解压文件到D盘 当然你可以 ...