Ползунок горизантальный
Toolboх -- jQure Slider
В htm исходнике во вкладке Between ...
<style>
.ui-slider .ui-slider-handle {
outline:none !important;
cursor: pointer !important;
}
</style>
<script>
$(function() {
var arr = [30000, 75000, 120000, 170000, 300000]; --- доступные суммы записывайте свои
var input = $("#Result");
var slider = $("#jQuerySlider").insertAfter( input ).slider({
step: 1,
change: function( event, ui ) {
input.val(arr[ui.value]);
},
slide: function( event, ui ) {
input.val(arr[ui.value]);
}
});
slider.slider( "option", "value", 1 );
});
</script>
Отправлено спустя 12 минут 37 секунд:
Тоже самое с двумя бегунками
<style>
.ui-slider .ui-slider-handle {
outline: none !important;
cursor: pointer !important;
}
</style>
<script>
$(function(){
$('#jQuerySlider').slider({
step:5,
min: 100,
max: 1000,
values: [300,500],
range: true,
change: function(event, ui) {
$('#Editbox1').val(ui.values[0]);
$('#Editbox2').val(ui.values[1]);
},
slide: function(event, ui){
$('#Editbox1').val(ui.values[0]);
$('#Editbox2').val(ui.values[1]);
}
});
$('#Editbox1').val($('#jQuerySlider').slider("values",0));
$('#Editbox2').val($('#jQuerySlider').slider("values",1));
$('#Editbox1').change(function(){
var value1=$('#Editbox1').val();
var value2=$('#Editbox2').val();
if (value1 < 100) { value1 = 100; $('#Editbox1').val(100)}
if(parseInt(value1) > parseInt(value2)){
value1 = value2;
$('#Editbox1').val(value1);
}
$('#jQuerySlider').slider("values",0,value1);
});
$('#Editbox2').change(function(){
var value1=$('#Editbox1').val();
var value2=$('#Editbox2').val();
if (value2 > 1000) { value2 = 1000; $('#Editbox2').val(1000)}
if(parseInt(value1) > parseInt(value2)){
value2 = value1;
$('#Editbox2').val(value2);
}
$('#jQuerySlider').slider("values",1,value2);
});
});
function validate(inp) {
inp.value = inp.value.replace(/[^0-9]/, "");
}
</script>
Отправлено спустя 5 минут 9 секунд:
Автозаполнения от cdnjs на jQuery
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.css"/>
<style>
.ui-corner-all {
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
}
.ui-menu {
border: 1px solid lightgray;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 15px;
background-color: white;
}
.ui-menu .ui-menu-item a {
color: #4F4F4F;
display: block;
}
.ui-menu .ui-menu-item a:hover {
border: 1px solid lightgray;
background: #708090;
color: #FFFFFF;
}
.ui-menu .ui-menu-item:hover {
display: block;
text-decoration: none;
color: #3D3D3D;
cursor: pointer;
background-color: lightgray;
background-image: none;
border:0;
}
</style>
<script>
var $_searchQuery = $('#region');
var data = [
"Алтайский край",
"Амурская область",
"Архангельская область",
"Астраханская область",
"Белгородская область",
"Брянская область",
"Владимирская область",
"Волгоградская область",
"Вологодская область",
"Воронежская область",
"Еврейская автономная область",
"Забайкальский край",
"Ивановская область",
"Иркутская область",
"Кабардино-Балкарская Республика",
"Калининградская область",
"Калужская область",
"Камчатский край",
"Карачаево-Черкесская Республика",
"Кемеровская область",
"Кировская область",
"Костромская область",
"Краснодарский край",
"Красноярский край",
"Курганская область",
"Курская область",
"Ленинградская область",
"Липецкая область",
"Магаданская область",
"Московская область",
"Мурманская область",
"Ненецкий автономный округ",
"Нижегородская область",
"Новгородская область",
"Новосибирская область",
"Омская область",
"Оренбургская область",
"Орловская область",
"Пензенская область",
"Пермский край",
"Приморский край",
"Псковская область",
"Республика Адыгея",
"Республика Алтай",
"Республика Башкортостан",
"Республика Бурятия",
"Республика Дагестан",
"Республика Ингушетия",
"Республика Калмыкия",
"Республика Карелия",
"Республика Коми",
"Республика Крым",
"Республика Марий Эл",
"Республика Мордовия",
"Республика Саха (Якутия)",
"Республика Северная Осетия — Алания",
"Республика Татарстан",
"Республика Тыва",
"Республика Хакасия",
"Ростовская область",
"Рязанская область",
"Самарская область",
"Саратовская область",
"Сахалинская область",
"Свердловская область",
"Смоленская область",
"Ставропольский край",
"Тамбовская область",
"Тверская область",
"Томская область",
"Тульская область",
"Тюменская область",
"Удмуртская Республика",
"Ульяновская область",
"Хабаровский край",
"Ханты-Мансийский автономный округ",
"Челябинская область",
"Чеченская Республика",
"Чувашская Республика",
"Чукотский автономный округ",
"Ямало-Ненецкий автономный округ",
"Ярославская область",
"Байконур",
"Москва",
"Санкт-Петербург",
"Севастополь"
];
$.ui.autocomplete.prototype._renderItem = function(ul, item) {
var re = new RegExp($.trim(this.term.toLowerCase()), "i");
var t = item.label.replace(re, "<span style='font-weight:600;color:#FF7361;'>" + "$&" + "</span>");
return $("<li></li>").data("item.autocomplete", item).append("<a>" + t + "</a>").appendTo(ul)
};
$_searchQuery.autocomplete({
source: data
});
</script>
Отправлено спустя 7 минут 25 секунд:
Определения страны / региона / города (в текст)
<script src="https://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU" type="text/javascript"></script>
<script>
$(document).ready(function(){
ymaps.ready(function(){
var geolocation = ymaps.geolocation;
$('#wb_strana').text('Ваша страна: '+geolocation.country);
$('#wb_region').text('Регион: '+geolocation.region);
$('#wb_gorod').text('Город: '+geolocation.city);
});});
</script>
<script>
$(document).ready(function(){
ymaps.ready(function(){
var geolocation = ymaps.geolocation;
$("#grad").val(ymaps.geolocation.city);
});});
</script>
<script>
$(document).ready(function(){
ymaps.ready(function(){
var geolocation = ymaps.geolocation;
$("#reg").val(ymaps.geolocation.region);
});});
</script>
Беседка
Правила форума
1. Темы на форуме надо называть адекватно.
2. Убедительная просьба, вопросы по программе, что и как сделать, работе сайтов, задавать в соответствующих разделах, отсюда они будут просто удаляться!
Подробнее: Правила создания новых тем и ответов на существующие темы.
1. Темы на форуме надо называть адекватно.
2. Убедительная просьба, вопросы по программе, что и как сделать, работе сайтов, задавать в соответствующих разделах, отсюда они будут просто удаляться!
Подробнее: Правила создания новых тем и ответов на существующие темы.
-
- Экспериментатор
- Сообщения: 78
- Зарегистрирован: 11 июл 2015, 21:57
- Версия Web Builder: 12.4
- Имя: Дмитрий
- Контактная информация:
Реклама
Вернуться в «Свободный раздел для общения на темы, не касающиеся Web Builder.»
Кто сейчас на конференции
Сейчас этот форум просматривают: нет зарегистрированных пользователей и 1 гость