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 相关文章推荐
Javascript 判断Flash是否加载完成的代码
Apr 12 Javascript
iframe子页面获取父页面元素的方法
Nov 05 Javascript
jQuery获取(选中)单选,复选框,下拉框中的值
Feb 21 Javascript
jquery中的常用事件bind、hover、toggle等示例介绍
Jul 21 Javascript
JavaScript匿名函数用法分析
Feb 13 Javascript
Js实现简单的小球运动特效
Feb 18 Javascript
Jquery实时监听input value的实例
Jan 26 Javascript
vue实现todolist单页面应用
Apr 11 Javascript
Angular实现表单验证功能
Nov 13 Javascript
深入Vue-Router路由嵌套理解
Aug 13 Javascript
解决Vue使用bus总线时,第一次路由跳转时数据没成功传递问题
Jul 28 Javascript
JavaScript与JQuery框架基础入门教程
Jul 15 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实现克鲁斯卡尔算法实例解析
2014/08/22 PHP
PHP面向对象程序设计继承用法简单示例
2018/12/28 PHP
PDO::getAttribute讲解
2019/01/28 PHP
Swoole实现异步投递task任务案例详解
2019/04/02 PHP
laravel框架中控制器的创建和使用方法分析
2019/11/23 PHP
动手学习无线电
2021/03/10 无线电
JavaScript入门教程(9) Document文档对象
2009/01/31 Javascript
基于jquery的超简单上下翻
2010/04/20 Javascript
使用Plupload实现直接上传附件至七牛云存储
2014/12/26 Javascript
JavaScript+canvas实现七色板效果实例
2016/02/18 Javascript
JS使用正则表达式过滤多个词语并替换为相同长度星号的方法
2016/08/03 Javascript
微信小程序 两种滑动方式(横向滑动,竖向滑动)详细及实例代码
2017/01/13 Javascript
js中new一个对象的过程
2017/02/20 Javascript
Babel 入门教程学习笔记
2018/06/13 Javascript
浅谈Vue初学之props的驼峰命名
2018/07/19 Javascript
javascript中的event loop事件循环详解
2018/12/14 Javascript
vue获取form表单的值示例
2019/10/29 Javascript
javscript 数组扁平化的实现
2020/02/03 Javascript
[00:56]2014DOTA2国际邀请赛 DK、iG 赛前探访
2014/07/10 DOTA
Python break语句详解
2014/03/11 Python
Python 迭代器工具包【推荐】
2016/05/06 Python
使用Python写CUDA程序的方法
2017/03/27 Python
Python正确重载运算符的方法示例详解
2017/08/27 Python
深入理解Python爬虫代理池服务
2018/02/28 Python
python3处理含有中文的url方法
2018/05/10 Python
python cs架构实现简单文件传输
2020/03/20 Python
基于wxPython的GUI实现输入对话框(1)
2019/02/27 Python
Python代码实现删除一个list里面重复元素的方法
2019/04/02 Python
Django框架模板用法入门教程
2019/11/04 Python
python批量处理txt文件的实例代码
2020/01/13 Python
什么是Python中的顺序表
2020/06/02 Python
优瑞自动咖啡机官网:Jura
2018/09/29 全球购物
小学安全教育材料
2014/02/17 职场文书
2014年领导班子专项整治整改方案
2014/09/28 职场文书
先进个人事迹材料范文
2014/12/30 职场文书
基于Python实现射击小游戏的制作
2022/04/06 Python