jquery 实现滑动条的简单验证
程序员文章站
2024-03-21 11:13:46
...
参考: blog.csdn.net/qq_42249896/article/details/81001877
另外还需要修复原来的 drag.js 里的两处 bug。
1 在 drag.js 的 dragOk(); 这句后面添加下面两句:
// 拖动成功后,将滑块置于最右侧
handler.css({'left': maxWidth});
drag_bg.css({'width': maxWidth});
这样可以保持滑块拖动成功后,滑块总是被置于最右侧。
效果:
2 如果需要自定义滑动条的宽度,需要在 drag.js 的
var handler = drag.find( '.handler' );
var drag_bg = drag.find( '.drag_bg' );
var text = drag.find( '.drag_text' );
这三句的后面添加下面几句,来修改滑动条的宽度
// 是否输入了滑动条的宽度参数
var newWidth = options.width;
var notHaveWidthParam = newWidth === null || newWidth === undefined;
// 根据输入的参数,修改滑动条的宽度
if(notHaveWidthParam !== true){
this.css({'width': newWidth});
text.css({'width': newWidth});
}
然后在页面的 js 里加上 width 参数来自定义滑动条的宽度
<script type="text/javascript">
$(function(){
$('#drag').drag({'width': '200px'}); // 自义滑动条的宽度
});
</script>
上一篇: Keepalived双机热备(LVS+Keepalive高可用群集)
下一篇: redis cluster集群架构详解(十九)- redis cluster实验: 多master写入、读写分离、高可用性
推荐阅读
-
jquery 实现滑动条的简单验证
-
java数据结构----图的遍历应用举例:编程实现判断一个有向图中任意给定的两个顶点之间是否存在一条长度为k的简单路径
-
java web中图片验证码功能的简单实现方法
-
java web中图片验证码功能的简单实现方法
-
java实现简单的窗体和密码验证(传参,事件机制和事件监听的作用过程) 博客分类: java图形界面基础,事件机制 javaJFrame监听器事件机制
-
ASP.NET中实现jQuery Validation-Engine的Ajax验证实现代码
-
ASP.NET中实现jQuery Validation-Engine的Ajax验证
-
php实现的简单中文验证码功能示例
-
Android自定义控件实现可左右滑动的导航条
-
ASP.NET中实现jQuery Validation-Engine的Ajax验证