1. 首页
  2. 文档
  3. WeUI.js文档
  4. 滑块(slider)

滑块(slider)

滑块,单位是百分比。注意,因为需要获取slider的长度,所以必须要在slider可见的情况下来调用。

slider(selector, [options])

Kind: global function

Param Type Default Description
selector string slider的selector
[options] object 配置项
[options.step] number slider的step,每次移动的百分比,取值范围 [0-100]
[options.defaultValue] number 0 slider的默认百分比值,取值范围 [0-100]
[options.onChange] function slider发生改变时返回对应的百分比,取值范围 [0-100]

Example

html

<div class="weui-slider-box">
    <div id="slider" class="weui-slider">
        <div class="weui-slider__inner">
            <div class="weui-slider__track"></div>
            <div class="weui-slider__handler"></div>
        </div>
    </div>
    <div id="sliderValue" class="weui-slider-box__value"></div>
</div>

js

weui.slider('#slider', {
    step: 10,
    defaultValue: 40,
    onChange: function(percent){
        console.log(percent);
    }
});


发表评论

电子邮件地址不会被公开。 必填项已用*标注