the_little,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script>
$(function() {
var arr = [0, 0];
function fn() {
$("#contentSlider").html(addSpaces(arr[0]));
$("#contentSlider2").html(arr[1]);
$("#calc-summ").html(arr[0] / 1E6 + arr[1])
}
$("#slider").slider({
range: "min",
value: 5E7,
min: 1E5,
max: 1E8,
step: 1E5,
slide: function(event, ui) {
arr[0] = +ui.value;
fn()
},
change: function(event, ui) {
arr[0] = +ui.value;
fn()
}
});
$("#slider").slider("option", "value", 5E7);
function addSpaces(nStr) {
nStr += "";
x = nStr.split(".");
x1 = x[0];
x2 = x.length > 1 ? "." + x[1] : "";
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) x1 = x1.replace(rgx,
"$1" + " " + "$2");
return x1 + x2
}
$("#slider2").slider({
range: "min",
value: 24,
min: 1,
max: 80,
step: 1,
slide: function(event, ui) {
arr[1] = +ui.value;
fn()
},
change: function(event, ui) {
arr[1] = +ui.value;
fn()
}
});
$("#slider2").slider("option", "value", 24)
});
</script>
</head>
<body>
<div class="landing-raschet-left-block">
<h2>Рассчитайте стоимость прямо сейчас</h2>
<div class="landing-raschet-summa">
<div class="landing-raschet-summa-text">Сумма гарантии</div>
<div class="landing-raschet-summa-number">
<div id="contentSlider" class="landing-raschet-summa-number-summ slider-range"></div>
<div class="landing-raschet-summa-number-curr">₽</div>
</div>
</div>
<div class="grade1">
<div id="slider"></div>
</div>
<div class="landing-raschet-srok">
<div class="landing-raschet-srok-text">Срок гарантии</div>
<div class="landing-raschet-srok-number">
<div id="contentSlider2" class="landing-raschet-srok-number-summ slider-range"></div>
<div class="landing-raschet-srok-number-curr">месяцев</div>
</div>
</div>
<div class="grade2">
<div id="slider2"></div>
</div>
</div>
<div id="calc-summ"></div>
</body>
</html>