๐ Elements like input[type=range]
yarn add rangebar
npm i -S rangebar
Or access to releases page. Then, download the latest version.
First, if you read as a separate file
<script src="/path/tp/rangebar.js"></script>
import Rangebar from 'rangebar';
new Rangebar({
target: getElementById('target')
data: {
style: {
// defualts
len: '8em',
width: '4px',
barBackgroundColor: '#222',
buttonBackgroundColor: '#cb1b45'
},
horizontal: true, // or false (vertical) (default: true)
min: 0, // minimum value (defualt: 0)
max: 100, // maximum value (default: 100)
buttons: [
// specify init position (required)
10,
20,
30
],
onChange(values) {
console.log(values.length) // 3, This returns the new value of this.buttons
}
}
});
test/fixtures/index.js
example/webpack/index.js
The MIT License (MIT)
Copyright (c) 2017 nju33 nju33.ki@gmail.com