9 бесплатных JQuery-слайдеров диапазона цены

Слайдеры диапазона цены чрезвычайно популярны на сегодняшний день. Возможность поиска товаров с помощью ввода диапазона минимальной и максимальной цены — это очень интересная функция.

Все эти красивые элементы, где диапазон цены можно задать с помощью слайдера, работают на jQuery. Вы можете разместить слайдеры на своем сайте, чтобы ваши посетители могли устанавливать ценовую категорию с помощью красивой формы.

Пожалуйста, дайте нам знать, если вы нашли какие-то новые слайдеры с интересным функционалом.

Содержание

Powerange — слайдер прайсов

Powerange — слайдер диапазона, его создатели черпали вдохновение в iOS 7 и телесериале «Могучие рейнджеры». Слайдер легко настраивается, как с помощью CSS, так и JavaScript.

Демо | Скачать

Flat jQuery Price Slider

Этот JQuery слайдер для выбора диапазона цен может пригодиться при реализации ваших веб-проектов. Кроме того он полностью бесплатный.

Демо | Скачать

3D HTML 5 jQuery Price Range Slider

3D HTML 5 jQuery Price Range Slider базируется на концепциях Эрика Дейнера.

Скачать

noUiSlider

noUiSlider — это простой слайдер диапазона без наворотов. Он использует хорошо структурированные скрипты и стилевые методы. Вы можете сами убедиться в том, насколько noUiSlider компактный, но его минимальные возможности прекрасно подходят для мобильных устройств, в том числе iPhone, iPad, Android-устройств, а также компьютеров и планшетов на Windows (Phone) 8.

Скачать

Basic slider

jQRangeSlider во многом опирается на использование CSS. Не забудьте включить один из предлагаемых стилей.

Демо | Скачать

Free BootStrap Component Slider

Исходный код

Free Minimal jQuery Slider

Этот базовый горизонтальный слайдер имеет всего один ползунок, который можно перемещать с помощью мыши или клавиш со стрелками.

Исходный код

jQuery Slider plugin

JQuery Slider — это простой в использовании и многофункциональный JQuery-плагин, который поддерживается всеми сенсорными устройствами на базе WebKit, такими как iPhone / IPod / IPad и Android. Ниже вы можете найти ссылки на демо-версию плагина и документацию.

Демо | Скачать

jQuery Mobile Price Slider

Чтобы добавить виджет слайдера на страницу, введите новый атрибут HTML5 type=”range”. Просто укажите значение (текущее), минимальное и максимальное значение атрибутов. Фреймворк сам сконфигурирует эти атрибуты, чтобы настроить слайдер.

Исходный код

HostSlide Hosting Plan & Pricing Slider – Premium

Слайдер для выбора тарифного плана хостинга и его стоимости — это, возможно, лучший виджет для вашего сайта. Он довольно компактный и может быть легко изменен в файле CSS.

Слайдер создан на основе JavaScript и поддерживается всеми основными браузерами. Это позволяет просто и быстро использовать данный слайдер для вывода ценовых диапазонов и характеристик тарифных планов хостинга.

Демо|Скачать

Данная публикация представляет собой перевод статьи «9 Free Jquery Price Range Sliders» , подготовленной дружной командой проекта Интернет-технологии.ру