需要引入的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. JS移动客户端--触屏滑动事件及js手机拖拽效果

    移动端触屏滑动的效果其实就是图片轮播,在PC的页面上很好实现,绑定click和mouseover等事件来完成.但是在移动设备上,要实现这种轮播的效果,就需要用到核心的touch事件.处理touch事件 ...

  2. WPF通过鼠标滑轮缩放显示图片

    如果你使用WinForm比较难实现通过滚动鼠标滑轮来对图片进行缩放显示,那么,你应该考虑一下使用WPF,既然是下一代Windows客户端开发平台,明显是有一定优势的,不然,MS是吃饱了撑着.   首先 ...

  3. Git 基础教程 之 版本回退

    不断对文件进行修改,然后不断提交修改到版本库里. 当你觉得文件修改到一定程度时,可以保存一个“快照”,这个“快照”在Git中称为“commit”. 一旦文件被改乱了.误删了,都可以从最近一个“comm ...

  4. jQuery动态效果

    1.一号店首页 2.淘宝网购物车

  5. Ali-Tomcat在eclipse多开的解决方法

    关于如何在eclipse配置Ali-Tomcat https://help.aliyun.com/document_detail/99410.html?spm=a2c4g.11186623.6.609 ...

  6. Linux查看 kennel , 物理CPU个数、核数、逻辑CPU个数

    other article on my list: 查看进程 https://i.cnblogs.com/PostDone.aspx?postid=9231604&actiontip=%E4% ...

  7. linux下最简单的端口转发工具

    linux下简单好用的工具rinetd,实现端口映射/转发/重定向 官网地址http://www.boutell.com/rinetd 软件下载wget http://www.boutell.com/ ...

  8. SCVMM-VMWARE ACE虚拟机管理工具

    SCVMM是微软的虚拟化管理工具 VMWARE ACE是另一套虚拟化的工具 这两套工具都是用来管理虚拟机的,可以直接将物理机虚拟化为虚拟机 企业一旦发展到了一定阶段,并然需要自己的服务器和虚拟化环境, ...

  9. asp.net--owin的知识点

    一篇很好的介绍owin的文章 http://kb.cnblogs.com/page/509236/ Owin在webconfig中定义启动配置类IdentityConfig的方法(代码来自极客学院的教 ...

  10. [bzoj3209]花神的数论题_数位dp

    花神的数论题 bzoj-3209 题目大意:sum(i)表示i的二进制表示中1的个数,求$\prod\limits_{i=1}^n sum(i)$ 注释:$1\le n\le 10^{15}$. 想法 ...