Изменить slider jquery-ui
Здравствуйте.
Использую slider jquery-ui для создания бегунка размера корниза. Все устраивает но, возникла необходимость его изменить. Вот сайт ссылка Можно ли сделать так что например при выборе 50 см Рекомендуемая розничная цена была 509, при выборе 60 см - 509 + 5, при выборе 70 см - 509 + 5 + 4, при выборе 80 см - 509 + 5 + 4 + 5 ну и так далее т.е. чередуется. А уже от полученного результата Рек. розн. цены. считать цену на сайте т.е. -20%. $(document).ready(function(){
// Указываем class блока div где будет ползунок.
$( ".slider" ).slider({
animate: true, // Анимация ползунка
range: "min", // Фон пути ползунка, если это свойство убрать, то синей линии не будет.
value: 520, // Значение по умолчанию.
min: 50, // Минимальная сумма.
max: 1010, // Максимальная сумма.
step: 10, // Шаг диапазона.
// Вывод диапазона
slide: function( event, ui ) {
$( "#slider-result" ).html(ui.value);
$( "#cena2" ).html(ui.value*10.5);
$( "#cena" ).html(ui.value*9);
},
// Вывод диапазона в поле input
change: function(event, ui) {
$('#text').attr('value', ui.value);
}
});
});
Кто может помочь помогите, очень надо, если возможно но сложно то напишите мне в скайп supportbricrb обсудим. Заранее всем спасибо |
roma88,
:-? <!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>slider demo</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/sunny/jquery-ui.css">
<style>
.slider { margin: 10px;width : 500px; height: 8px }
.ui-slider-handle{border-radius:50%; position: relative; font-size: 14px; display: block; }
.ui-slider-horizontal .ui-slider-handle{top:-0.3em}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
</head>
<body>
<input id="text">
<div class="slider"></div>
<div id="cena2" ></div><div id="cena"></div>
<script>
$(document).ready(function () {
function price(num) {
var sum = 509,
n = 1;
for (var i = 50; i < num; i += 10) {
n ^= 1;
sum += n ? 4 : 5;
}
return [sum, (sum * .8) | 0]
}
// Указываем class блока div где будет ползунок.
$(".slider").slider({
animate: true, // Анимация ползунка
range: "min", // Фон пути ползунка, если это свойство убрать, то синей линии не будет.
value: 520, // Значение по умолчанию.
min: 50, // Минимальная сумма.
max: 1010, // Максимальная сумма.
step: 10, // Шаг диапазона.
// Вывод диапазона
slide: function (event, ui) {
$('#text').val(ui.value);
var value = price(ui.value);
$("#cena2").text(value[0]*47.3995|0);
$("#cena").text(value[1]*47.3995|0);
},
// Вывод диапазона в поле input
change: function (event, ui) {
$('#text').val(ui.value);
var value = price(ui.value);
$("#cena2").text(value[0]*47.3995|0);
$("#cena").text(value[1]*47.3995|0);
}
})
$(".slider").slider("value", 520);
});
</script>
</body>
</html>
|
Спасибо огромное человечище)
|
может еще подскажете, выходной результат цену, нужно перевести в рубли, что нужно умножить на курс чтобы результат был в рублях?
// Вывод диапазона в поле input
change: function (event, ui) {
$( "#slider-result" ).html(ui.value);
var value = price(ui.value* 47.3995);
$("#cena2").html(value[0]);
$("#cena").html(value[1]);
}
но считает не правильно :( |
roma88,
$("#cena2").html(value[0] * 47.3995); наверное так |
не, так тоже к сожалению нет :(
|
roma88,
тогда сформулируйте ваш вопрос чтоб было понятно ))) пока мне неизвестно - что вы переводите в рубли и по какой формуле |
нужно результат который выводится в
var value = price(ui.value);
$("#cena2").html(value[0]);
$("#cena").html(value[1]);
умножить на курс, т.е. если $("#cena2").html(value[0]) = 509 то умножить это на курс обмена т.е. на 47,3995 и так далее делаю так var value = price(ui.value*47,3995);
$("#cena2").html(value[0]);
$("#cena").html(value[1]);
не правильно считает не на 47,3995 умножает а на 36,05 если так $("#cena2").html(value[0]*47,3995);
$("#cena").html(value[1]*47,3995);
вообще ерунда |
Цитата:
|
это здесь просто от руки писал а не копировал) там точка стоит)
|
| Часовой пояс GMT +3, время: 21:18. |