html数字滚动选择,jQuery滑动选取数值范围插件jRange(jquery.range.js)

【温馨提示】源码包解压密码：www.youhutong.com

jQuery滑动选取数值范围插件jRange(jquery.range.js)

1、HTML部分：

1》首先载入jQuery库文件以及jRange相关的css文件和插件文件(jquery.range.css和jquery.range.js插件文件)

2》然后在需要展示滑块选择器的位置放入以下代码：

我们使用了hiiden类型的文本域，设置默认值value，如23。

2、JS部分：

调用jRange插件，直接用下面的代码：$('.range-slider').jRange({

from: 0,

to: 100,

step: 1,

scale: [0,25,50,75,100],

format: '%s',

width: 300,

showLabels: true,

isRange : true

});

然后运行就可以看到效果了！

选项设置

插件jRange也提供了一些必要的选项设置来满足各种需求。选项说明默认值

from滑动范围的最小值，数字，如0

to滑动范围的最大值，数字，如100

step步长值，每次滑动大小1

scale滑动条下方的尺度标签，数组类型，如[0,50,100][from,to]

showLabels布尔型，是否显示滑动条下方的尺寸标签true

showScale布尔型，是否显示滑块上方的数值标签true

format数值格式"%s"

width滑动条宽度300

isRange是否为选取范围。false

浏览器启用弹出窗口过滤功能，将无法跳转到下载页。在浏览器地址栏右边符号提示处点击允许就可以了！

【温馨提示】源码包解压密码：www.youhutong.com

郑重声明：

1、本站源码仅供个人学习研究和交流使用，请于下载后二十四小时内删除

2、本站大多资源来源于互联网、用户分享，仅供学习交流使用，本站不提供任何技术支持

3、本站联系方式Email：admin@youhutong.com ，收到邮件会第一时间处理。

4、如侵犯到任何版权问题，请立即告知本站(立即在线告知)，本站将及时删除并致以最深的歉意