html 文件域变滑块,小巧的jQuery区域范围滑块插件noUiSlider
小巧的jQuery区域范围滑块插件noUiSlider
分类：代码
日期：2020-02-10
点击(21,970)
下载(0)
来源：未知
收藏
区域范围滑块在 Windows 系统中很常见，如更改分辨率(Windows XP 为横向，Windows 7 为纵向)。在 HTML5 中，input 也新增了一个类似这种效果的 type 属性 range，这种滑块能给用户提供更好的体验，然而古老的 IE6、IE7 和 IE8 等并不支持。如果希望在 IE 中使用这种效果，那么 noUiSlider 也许可以帮到你。
noUiSlider 是一款小巧的范围滑块插件，它能很轻松的制作出类似 HTML5 中 type=”range” 的效果，甚至是更强大的效果。它可以制作横向和种纵向的滑块，甚至是两个滑块选取某一段范围，noUiSlider 的数值可以精确到小数点后一位或后两位。
noUiSlider 兼容 Firefox、Chrome、Opera、Safari 和 IE7+ 浏览器，其实也兼容 IE6，只是样式上有点小问题。
使用方法
引入文件
HTML
class=”noUiSlider” 是必须的，因为需要与样式结合，除非你想自己写样式，class 可以添加多个值。
JavaScript
$(function() {
$('.noUiSlider').noUiSlider({
range: [0, 100],
start: 0,
step: 10,
handles: 1
});
});
参数
参数
类型
说明
默认值
range
数组
必填，滑块的总范围
无
start
数组
设置滑块开始至结束的范围
无
handles
整数
设置滑块的数量，可选 1 或 2
2
connect
字符串或布尔值
连接，可选 lower、upper、true、false
无
orientation
字符串
设置滑块的方向，可选 vertical(纵向)或 horizontal(横向)
horizontal
margin
数值
当有两个滑块时(即 handles 为 2)，设置两个滑块的最小距离
无
serialization
传递数值及设置数值小数点位数(查看下表)
无
slide
函数
允许你编写任意函数
无
step
数值
滑块每滑动一步的数字
无
选项
参数
to
$Object, “string”,array[$Object, $Object],array[“string”, “string”]
booleanfalse
resolution
1、0.1、0.01
html 文件域变滑块,小巧的jQuery区域范围滑块插件noUiSlider相关推荐
- (转)强大的JQuery表单验证插件 FormValidator使用介绍
jQuery formValidator表单验证插件是客户端表单验证插件. 在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人资料,录入一些常规数据等等.在这之前,页面开发者( ...
- 强大的JQuery表单验证插件 FormValidator使用介绍
jQuery formValidator表单验证插件是客户端表单验证插件. 在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人资料,录入一些常规数据等等.在这之前,页面开发者( ...
- 使用jQuery清空file文件域的解决方案
使用jQuery清空file文件域的解决方案 var file = $("#file") file.after(file.clone().val("")); f ...
- jQuery清空input file文件域的解决方案
在对一个文件域(input type="file")使用了验证后,我们总会希望把文件域中的值给清空了(否则错误的文件仍然会被提交),而在IE中,安全设置的原因,是不允许更改文件域的 ...
- thinkphp如何一次性的上传多个文件,在文件域中可以多选?
可以做到类似于某度网盘的样式吗? 文件夹的命名, 可以用单数, 也可以用复数, 在同一个项目中, 只要统一就好了. 毕竟项目开发不同于英语写作. 建议使用缩写, 不管是不是缩写都用单数, 这样简洁,容 ...
- jQuery UI 实例 - 滑块（Slider）
拖动手柄来选择一个数值. 如需了解更多有关 slider 部件的细节,请查看 API 文档 滑块部件(Slider Widget). 默认功能 基本的滑块是水平的,有一个单一的手柄,可以用鼠标或箭头键 ...
- HTML -- HTML文本框、单选框、多选框、按钮、文本域、文件域、下拉框、搜索框滑动和简单验证
1. HTML文本框.单选框.多选框.按钮.文本域.文件域.下拉框.搜索框滑动和简单验证 1.1 表单元素格式 placeholder 提示文本. 示例: <!DOCTYPE html> ...
- Java文件合并变得语义化
与任何程序员交谈,并询问他应该如何进行合并:"它应该理解代码,对其进行解析,然后根据结构进行合并" –他很可能会说. 而这恰恰是SemanticMerge for Java所做的: ...
- html-下拉框、文本域、文件域
一.下拉框 <!-- 下拉框 , 列表框selected: 默认选中--><p>国家:<select name="列表名称"><optio ...
最新文章
- 「小程序JAVA实战」小程序的页面重定向（60）
- RecylerView动画组件RecylerViewAnimators
- Oracle中PLSQL中if语句的写法
- java并发编程之AbstractQueuedSynchronizer
- node.js热部署
- 网贷申请技巧，提高90%通过率
- LeetCode 476. 数字的补数（移位 异或^）
- 冲压模板自动标注LISP_干货满满！超实用冲压模具资料，加薪必看！
- python return用法_遗传算法(Python) #4 DEAP框架入门
- aotuwried是java的注解吗_@autowire注入为null
- HttpWebRequest以及HttpWebResponse
- 关于bootstrap--排版（标题、强调、背景、插入符等）
- 2021年的工作日记模板准备好了
- java 线程 block_JAVA线程的BLOCK状态实例分析
- C++ Primer 第三版电子版PDF
- 电脑图标出现蓝色问号解决方法
- 大恒MER-1070-10GC相机 LINUX环境 QT开发记录
- 认识异或运算的本质与基本规律，0^x=x,x异或x=0，有交换律，结合律，与顺序无关
- java对接杉德支付完整代码
- Nature：Rob Knight团队发现血液和组织微生物组可诊断癌症