Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 

dragBar

拖动选择条

点击查看 demo


注意事项:

  • 发现bug或技术上的交流请发邮件到:xyzsyx@163.com
  • 本插件依赖jQuery库
  • 本demo为本人早起所写,可能写法不适用于现在的框架页面,这里只是提供思路和效果

使用方法:

  1. 导入样式表
    <link rel="stylesheet" type="text/css" href="./styles/index.css" />
  1. 导入jquery库文件和autoTime.js
	<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="./scripts/index.js"></script>
  1. DOM
    <div class="drag-bar drag-bar-1" data-curVal="0">
        <span class="drag-start">0</span>
        <div class="drag-shape">
          <div class="drag-bar-process"></div>
          <div class="drag-text-process">
            <span class="drag-cur">0</span>
          </div>
        </div>
        <span class="drag-end">0</span>
      </div>
  1. 调用 / 初始化
	$.dragBar({
        dragBar: ".drag-bar-1",
        width: 300,
        startVal: 100,
        endVal: 200,
        val: 100
    });

option

dragBar {string}
css 选择器
例如:".drag-bar"
drag {boolean}
是否可拖动
width {number || undefined}
宽度 
缺省:根据控件的内部元素结构及内部元素各自的占位大小算出的最小值
startVal {number}
起始值
endVal {number}
终止值
val {number}
初始值

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published