1
這是我使用的功能使得範圍滑塊:添加到小數rangeslider
function rangeSlider(id, onDrag) {
var range = document.getElementById(id),
dragger = range.children[0],
draggerWidth = 20, // width of your dragger
down = false,
rangeWidth, rangeLeft;
dragger.style.width = draggerWidth + 'px';
dragger.style.left = -draggerWidth + 'px';
dragger.style.marginLeft = (draggerWidth/2) + 'px';
range.addEventListener("mousedown", function(e) {
rangeWidth = this.offsetWidth;
rangeLeft = this.offsetLeft;
down = true;
updateDragger(e);
return false;
});
document.addEventListener("mousemove", function(e) {
updateDragger(e);
});
document.addEventListener("mouseup", function() {
down = false;
});
function updateDragger(e) {
if (down && e.pageX >= rangeLeft && e.pageX <= (rangeLeft + rangeWidth)) {
dragger.style.left = e.pageX - rangeLeft - draggerWidth + 'px';
if (typeof onDrag == "function") onDrag(Math.round(((e.pageX - rangeLeft)/rangeWidth) * 100));
}
}
}
// Run!
rangeSlider('range-slider-1', function(value) {
document.getElementById('test-result').innerHTML = value + '%';
});
rangeSlider('range-slider-2', function(value) {
document.getElementById('test-result').innerHTML = value + '%';
});
JSBIN:http://jsbin.com/yuvekecodo/edit?html,js,output
我怎麼能在小數輸出?
例如,如果我設置範圍從10 - 100我希望它能夠有小數。 10.01,10.02,10.03〜99.97。 99.98,99.99等
達到這個目標的最佳方法是什麼?
謝謝你們,我在這幾天放棄了我的想法。
乾杯。
Thanksl
請檢查更新功能,將顯示'startpnt = 10'和'endpnt = 50'值的百分比 – bharat