jquery插件star-rating.js实现星级评分特效


Posted in Javascript onApril 15, 2015

特效介绍

jquery星级评分插件star-rating.js下载插件,点击星星或者心的左边,就是半分,右边就是1分。点击减号,分数置为0。不兼容IE8以下的浏览器。

演示图

jquery插件star-rating.js实现星级评分特效

使用方法

第一步、引入下面的代码:

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet">

<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>

<link href="css/star-rating.css" media="all" rel="stylesheet" type="text/css"/>

<script src="js/star-rating.js" type="text/javascript"></script>

第二步、想要使用什么效果,就引入相应的input框:

<input id="input-2b" type="number" class="rating" min="0" max="5" step="0.5" data-size="xl"

   data-symbol="" data-default-caption="{rating} hearts" data-star-captions="{}">

第三步,如果需要重置或者提交按钮,可以引入下面的代码:

<button type="submit" class="btn btn-primary">Submit</button>

<button type="reset" class="btn btn-default">Reset</button>

第四步、引入js调用代码:

<script>

   jQuery(document).ready(function () {

       $(".rating-kv").rating();

   });

</script>

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
jquery统计复选框选中示例
Nov 05 Javascript
JS实现两表格里数据来回转移的方法
May 28 Javascript
js+canvas绘制矩形的方法
Jan 28 Javascript
Google 地图叠加层实例讲解
Aug 06 Javascript
js在ie下打开对话窗口的方法小结
Oct 24 Javascript
AngularJS实现网站换肤实例
Feb 19 Javascript
基于Bootstrap漂亮简洁的CSS3价格表(附源码下载)
Feb 28 Javascript
vue-router中的hash和history两种模式的区别
Jul 17 Javascript
Vue一次性简洁明了引入所有公共组件的方法
Nov 28 Javascript
微信小程序冒泡事件及其阻止方法实例分析
Dec 06 Javascript
微信小程序实现电子签名功能
Jul 29 Javascript
vue3为什么要用proxy替代defineProperty
Oct 19 Javascript
JQuery判断radio(单选框)是否选中和获取选中值方法总结
Apr 15 #Javascript
jQuery实现首页顶部可伸缩广告特效代码
Apr 15 #Javascript
JavaScript实现网页对象拖放功能的方法
Apr 15 #Javascript
Jquery判断radio、selelct、checkbox是否选中及获取选中值方法总结
Apr 15 #Javascript
jQuery实现仿路边灯箱广告图片轮播效果
Apr 15 #Javascript
JavaScript中window.open用法实例详解
Apr 15 #Javascript
flash+jQuery实现可关闭及重复播放的压顶广告
Apr 15 #Javascript
You might like
PHP网页游戏学习之Xnova(ogame)源码解读(五)
2014/06/23 PHP
php parse_str() 函数的定义和用法
2016/05/23 PHP
php版微信自动登录并获取昵称的方法
2016/09/23 PHP
Yii2实现自定义独立验证器的方法
2017/05/05 PHP
PHP基于方差和标准差计算学生成绩的稳定性示例
2017/07/04 PHP
yii2中LinkPager增加总页数和总记录数的实例
2017/08/28 PHP
nicejforms——美化表单不用愁
2007/02/20 Javascript
jQuery实现响应浏览器缩放大小并改变背景颜色
2014/10/31 Javascript
微信JS接口汇总及使用详解
2015/01/09 Javascript
基于jQuery实现美观且实用的倒计时实例代码
2015/12/30 Javascript
微信小程序 高德地图SDK详解及简单实例(源码下载)
2017/01/11 Javascript
Javascript中字符串和数字的操作方法整理
2017/01/22 Javascript
详解nodejs微信公众号开发——5.素材管理接口
2017/04/11 NodeJs
[52:09]2014 DOTA2华西杯精英邀请赛 5 25 NewBee VS DK第二场
2014/05/26 DOTA
[01:31]完美与DOTA2历程
2014/07/31 DOTA
python实现猜数字游戏(无重复数字)示例分享
2014/03/29 Python
跟老齐学Python之关于循环的小伎俩
2014/10/02 Python
python os用法总结
2018/06/08 Python
python scp 批量同步文件的实现方法
2019/01/03 Python
Python基于opencv调用摄像头获取个人图片的实现方法
2019/02/21 Python
python itchat实现调用微信接口的第三方模块方法
2019/06/11 Python
windows10下安装TensorFlow Object Detection API的步骤
2019/06/13 Python
Golang GBK转UTF-8的例子
2019/08/26 Python
python实现静态服务器
2019/09/05 Python
python使用paramiko实现ssh的功能详解
2020/03/06 Python
keras之权重初始化方式
2020/05/21 Python
Django中Aggregation聚合的基本使用方法
2020/07/09 Python
python实现快速文件格式批量转换的方法
2020/10/16 Python
python二维图制作的实例代码
2020/12/03 Python
纯css3实现的动画按钮的实例教程
2014/11/17 HTML / CSS
软件测试企业面试试卷
2016/07/13 面试题
感恩母亲节演讲稿
2014/05/07 职场文书
法人授权委托书
2014/09/16 职场文书
自习课吵闹检讨书范文
2014/09/26 职场文书
2015年事业单位办公室文员工作总结
2015/04/24 职场文书
python开发人人对战的五子棋小游戏
2022/05/02 Python