Javascript实现滑块滑动改变值的实现代码

最近做了一个关于税务的功能，值得一说的是本页面的滑块实现。大家都知道现实中的程序员大部分都是对于页面和美工不是很熟悉。本人也是，但是本人比较喜欢自己动手来实现。废话不多说。上图：实现结果：

部分射流研究…代码：复制代码代码如下：窗口。onload=function(){ var oWin=document。getelementbyid(' win ')；var bDrag=false var DIsX=DIsY=0；哦。onmousedown=function(event){ var event=event | | window。事件；bDrag=真；disX=事件。clientx-owin。offsetleft这个。设置捕获这个。setcapture()；返回false }；哦。onmousemove=function(event){ if(！bDrag)返回；var event=event | | window . event var iL=event。客户端x-DIsX；var maxL=480iL=iL 0？0 : iLiL=iL maxL？maxL : iLowin。风格。上边距=owin。风格。边距ft=0；哦。风格。left=iL ' px//滑块距离左边的位置文件。getelementbyid(' hkline ')。风格。宽度=iL//滑块左边绿色条目的宽度返回false }；文件。onmouseup=window。onb lur=owin。onlose capture=function(){ BDrag=false；哦。释放捕获owin。释放捕获()；};};说明： 1、主要用的onmousedown和onmousemove记录了拖动之后的位置。然后通过数字正射影像图操作去改变相应的组件渲染备注：由于公司网络不是很理想。回家之后会把所有源码上传