Фильтр цены с бегунком — различия между версиями

Материал из Umicms
Перейти к:навигация, поиск
(Новая страница: «category:Модуль Каталог '''Актуально для версии 2.9''' == Задача == На примере шаблона demodizzy сдел…»)
(нет различий)

Версия 14:07, 27 июня 2013

Актуально для версии 2.9

Задача

На примере шаблона demodizzy сделать в каталоге фильтрацию по цене с бегунком


Решение

Для задачи мы нашли готовое решение http://jqueryui.com/slider/#range

Осталось только адаптировать его для нашего шаблона.

Для этого:

1)

				<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" charset="utf-8" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" charset="utf-8">
 $(function() {
$( "#slider-range" ).slider({
range: true,
min: 0,
max: 10000,
values: [ 0, 10000 ],
slide: function( event, ui ) {
$( "#amount1" ).val(ui.values[ 0 ]);
$( "#amount2" ).val(ui.values[ 1 ]);
}
});
$( "#amount1" ).val($( "#slider-range" ).slider( "values", 0 ));
$( "#amount2" ).val($( "#slider-range" ).slider( "values", 1 ));
}
);