H5Slider

功能描述

H5Slider是高度自定义双滑块选择器，可按项目需求，调整各项功能

依赖模块

无

快速使用

  1.   var slider = H5Slider({
  2.       var from = 0;  //滑块开始值
  3.       var to = 200;  //滑块结束值
  4.       var step = 5;  //步长
  5.       var format = 'KM'; //下标单位名
  6.       var width = 300;  // 滑动条宽度
  7.       var showLabels = true;  //是否显示下标文字
  8.       var value = '15,50';  //滑块初始值，左边为开始值，右边为结束值 ，中间以,隔开(如果不填，将只出现1个滑块)
  9.       getValue(function(start,end){
  10.       console.log(start);
  11.       console.log(end);
  12.       })
  13.   })

特别说明

  1. from,to,step,format,width,showLabels,value （必填）
  3.     选填(样式自定义):
  4.       height   //华动条高度 (，默认 8px)
  5.       SbgColor //选中滑动条背景色 (选填，默认'#c23D23')
  6.       bgColor  //整条滑动条背景色 （选填，默认灰色渐变 格式：'linear-gradient(to bottom, #262626, #dddddd)'）
  7.       firstblock = {    //可不写，有默认值 (一旦填写必须按该格式，否则有可能引起错误)
  8.             'top': '-16px', //滑块相对于滑动条的高度（可按需求进行调整）
  9.             'width': '38px', //滑块的宽度
  10.             'height': '38px', //滑块的高度
  11.             'border-radius': '19px', //滑块的圆角
  12.             'border': '6px solid rgba(194,61,51,1)', //滑块的边框大小及边框颜色
  13.       };
  14.           var wordStyle = { //下标文字样式（默认）(一旦填写必须按该格式，否则有可能引起错误)
  15.             'color': '#666', //下标文字颜色
  16.             'background-color': '#ffffff', //下标文字背景颜色
  17.             'top': '27px', //下标距离滑块的高度
  18.             'font-size': '24px', //下标文字大小
  19.           };