Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.04.2009, 20:15
Интересующийся
Отправить личное сообщение для Hetfield Посмотреть профиль Найти все сообщения от Hetfield
 
Регистрация: 19.11.2008
Сообщений: 14

клик по скролл-бару
Здравствуйте. У меня по щелчку появляется див с элементами внутри него. Элементов может быть много и так как див ограничен по высоте, у него появляется вертикальный скролл-бар, в зависимости от кол-ва элементов. Так вот, нужно чтобы он вел себя как обычный select. То есть "сворачивался" только тогда, когда либо выбран внутри него элемент либо кликнули вне слоя.

Вариант когда выбран элемент не проблема, меня интересует когда кликнули вне слоя:

Я сделал так:
$("body").mouseup( function () { $("#j_country_list").addClass("hidden"); } );

Проблема в том, что в FF если в этом диве сликнуть на скролл-бар (с целью прокрутить вниз содержимое) он тоже его скрывает. Как мне исключить скролл-бар?
Ответить с цитированием
  #2 (permalink)  
Старый 21.04.2009, 18:58
Аватар для x-yuri
Отправить личное сообщение для x-yuri Посмотреть профиль Найти все сообщения от x-yuri
 
Регистрация: 27.12.2008
Сообщений: 4,201

дай упрощенный неработающий в ff вариант - http://javascript.ru/paste
Ответить с цитированием
  #3 (permalink)  
Старый 22.04.2009, 07:52
jsch
 
Сообщений: n/a

пробуй при onmousedown запоминать значение .scrollTop а при onmouseup сравнивать это значение и если оно поменялось то не закрывать див
Ответить с цитированием
  #4 (permalink)  
Старый 22.04.2009, 07:58
jsch
 
Сообщений: n/a

а еще лучше при onmousedown поставить флаг "мышь нажата" и запомнить .scrollTop
при onmousemove проверять если "мышь нажата" проверять поменялось ли значение .scrollTop, если поменялось то ставить флаг "скролинг был"
при onmouseup проверять если "скролинг был" то не закрывать див
Ответить с цитированием
  #5 (permalink)  
Старый 22.04.2009, 19:54
Интересующийся
Отправить личное сообщение для Hetfield Посмотреть профиль Найти все сообщения от Hetfield
 
Регистрация: 19.11.2008
Сообщений: 14

Собстна сюда код решил вставить...
Я просто не силен в javascript. Если покажите как это делать , буду признателен

$(document).ready(function() {

$("#j_country_select").bind("click", function () { $("#j_country_list").removeClass("hidden"); });

//$("#j_country_select").srBlur( function () { $("#j_country_list").addClass("hidden"); });
//$("body").mouseup( function () { $("#j_country_list").addClass("hidden"); } );
$("#j_country_list a").bind("click", function() {
$("#j_country_list").addClass("hidden");
$("#j_contry_value").attr("value", $(this).attr("id"));
$("#j_country_selected").text($(this).text());
return false;
});

});
<span style="font-size: 0.8em">Страна:</span><br />
<input id="j_contry_value" type="hidden" name="country" value="" />
<div id="j_country_select" class="good_select_down_cru">
<div id="j_country_selected" class="good_selected"></div>
<div id="j_country_list" style="height: 170px; overflow: auto; border-top: 1px solid #b5b6b5; background: #fff;" class="hidden">
<a id="ru" href="#">Russia</a>
<a id="ua" href="#">Ukraine</a>
</div>
</div><br />
Ответить с цитированием
  #6 (permalink)  
Старый 23.04.2009, 08:55
jsch
 
Сообщений: n/a

$(document).ready(function(){
	$("#j_country_select").bind("click", function(){
		$("#j_country_list").removeClass("hidden");
	});

	$("#j_country_list a").bind("click", function(){
		$("#j_country_list").addClass("hidden");
		$("#j_contry_value").attr("value", $(this).attr("id"));
		$("#j_country_selected").text($(this).text());
		return false;
	});

	flag_mousedown = false;
	value_scroll_top = 0;
	flag_scrolled = false;

	$("body").mouseup(function(){
		if(!flag_scrolled){
			$("#j_country_list").addClass("hidden");
		}
		flag_scrolled = false;
	});
	$("#j_country_list").mousedown(function(){
		flag_mousedown = true;
		value_scroll_top = $("#j_country_list").scrollTop();
	});
	$("#j_country_list").mousemove(function(){
		if(flag_mousedown){
			if(value_scroll_top != $("#j_country_list").scrollTop()){
				flag_scrolled = true;
				flag_mousedown = false;
			}
		}
	});
});
Ответить с цитированием
  #7 (permalink)  
Старый 23.04.2009, 09:02
оыср
 
Сообщений: n/a

или так:
$(document).ready(function(){
	$("#j_country_select").bind("click", function(){
		$("#j_country_list").removeClass("hidden");
	});
	$("#j_country_list a").bind("click", function(){
		$("#j_country_list").addClass("hidden");
		$("#j_contry_value").attr("value", $(this).attr("id"));
		$("#j_country_selected").text($(this).text());
		return false;
	});

	$("body").mouseup(function(){
		$("#j_country_list").addClass("hidden");
	});
	$("#j_country_list").mouseup(function(){
		return false;
	});
});

Ответить с цитированием
  #8 (permalink)  
Старый 23.04.2009, 09:37
Интересующийся
Отправить личное сообщение для Hetfield Посмотреть профиль Найти все сообщения от Hetfield
 
Регистрация: 19.11.2008
Сообщений: 14

Ребят, всем спасибо за помощь!!!
оыср, работает отлично.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Скрытый слой появляется на клик comcam Элементы интерфейса 15 08.09.2008 11:01