Не могу никак разобраться с одной задачей..
Есть ползунок:
---
min: "1 000"
max: "200 000"
step "500"
if value > "50 000"
step "5 000"
---
Проблема в том что "50 000" должно находиться по средине шкалы.
И еще не могу понять почему когда я условиями изменяю шаг, после "50 000" у меня идет "56 000" а после уже добавляется по "5 000"...
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css">
</head>
<body>
<div class="slider-range range-uah"></div>
<div class="result-block"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>
<script>
$(function() {
$( ".range-uah" ).slider({
range: "min",
value: 20000,
step: 500,
min: 1000,
max: 200000,
slide: function( event, ui ) {
var res = ui.value;
if (res >= 50000) {
$( ".range-uah" ).slider({step: 5000});
$( ".result-block" ).html(res);
} else {
$( ".range-uah" ).slider({step: 500});
$( ".result-block" ).html(res);
}
}
});
$( ".result-block" ).html($( ".range-uah" ).slider( "value" ));
});
</script>
</body>
</html>
Дайте совет, что нужно сделать и как логически это продумать...