Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 03.10.2010, 02:23
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,480

Сообщение от arwprod Посмотреть сообщение
Aetae, а кросс-браузерного варианта для отмены всплытия от нижнего элемента к верхнему нету? =\
А для кого я линк в пост вставил?)
Ответить с цитированием
  #12 (permalink)  
Старый 03.10.2010, 02:37
Интересующийся
Отправить личное сообщение для arwprod Посмотреть профиль Найти все сообщения от arwprod
 
Регистрация: 11.09.2010
Сообщений: 20

Aetae, либо ночь на дворе, либо: "Остановка всплытия" - кроссбраузерно, а остальное нет... Хотя в моем случае по-моему все равно откуда и куда двигаться... пора спать, завтра выложу результат =\
Ответить с цитированием
  #13 (permalink)  
Старый 03.10.2010, 02:53
Интересующийся
Отправить личное сообщение для arwprod Посмотреть профиль Найти все сообщения от arwprod
 
Регистрация: 11.09.2010
Сообщений: 20

Octane,
Вы это имели ввиду?
if($(event.target.nodeName).parent('ul').hasClass('menu')){alert('Нажали на меню')}

вместо alerta делаем вызов по умолчанию, в противном случае, выключаем менюшку?
Ответить с цитированием
  #14 (permalink)  
Старый 03.10.2010, 11:47
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<style type="text/css">
body {background: #424A51;}
.block {position:absolute;top:20%;left: 40%;width: 200px;height: 50px;}
.block a {border: 1px solid #DDD;color: #FFF;display: block;text-align: center;text-decoration:none;width: 140px;height: 20px;}
.block img {border: 1px solid #DDD; width: 140px;height: 50px;}
</style>

<script type="text/javascript">
$(function(){
	$('.block').each(function(){
		$(this).find('img').hide();
		$(this).find('a').mouseover(function(){
			$(this).next('img').show();
		});
		$(document).click(function(e){
			(e.target.nodeName != $('.block img').get(0).tagName) && $(this).find('img').hide();
		});
	});
});
</script>

<div class="block">
	<a href="#" rel="">link</a>
	<img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif" alt="" />
</div>

Последний раз редактировалось monolithed, 03.10.2010 в 12:08.
Ответить с цитированием
  #15 (permalink)  
Старый 03.10.2010, 12:29
Интересующийся
Отправить личное сообщение для arwprod Посмотреть профиль Найти все сообщения от arwprod
 
Регистрация: 11.09.2010
Сообщений: 20

monolithed, не пойдет

$("body").click(function(event) {
	if($(event.target.nodeName).parents('ul').hasClass('menu') || event.target.className == 'menu'){
		//открываем меню, сделав еще1 клик
	} else {
		//закрываем меню
	}
});


пока рабочий вариант только этот, но, если нужно открыть меню по клику, то приходится делать 2 клика, а если открыть нужно при наводке, то сначала делаем клик, потом немного теребим мышку и вуаля... в общем бред. Как вариант, сделать иначе:

//conf - options	
if(conf.event == 'click') {
	$("body").click(function(event) {
		if($(event.target.nodeName).parents('ul').hasClass('menu') || event.target.className == 'menu'){
			//открываем меню, без какого-либо event
		} else {
			//закрываем меню
		}
	}); 
} else {
	//юзаем обычный hover для работы с вложенностью
}
Ответить с цитированием
  #16 (permalink)  
Старый 03.10.2010, 12:41
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

Цитата:
arwprod monolithed, не пойдет
Интересно узнать почему?
Ответить с цитированием
  #17 (permalink)  
Старый 03.10.2010, 12:46
Интересующийся
Отправить личное сообщение для arwprod Посмотреть профиль Найти все сообщения от arwprod
 
Регистрация: 11.09.2010
Сообщений: 20

monolithed,
потому что, если
$(this).find('a').mouseover(function(){

заменить на
$(this).find('a').click(function(){

картинка не откроется вообще
Ответить с цитированием
  #18 (permalink)  
Старый 03.10.2010, 14:46
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

Сообщение от arwprod
$(event.target.nodeName)
Зачем nodeName?

Код простейший же:
<!DOCTYPE html>
<meta charset="UTF-8">
<title>Menu</title>
<style>
body {
	font: 14px/24px sans-serif;
}
.nav {
	height: 24px;
	background: #ccc;
	zoom: 1; /* IE7 clear fix */
}
.nav:after {
	display: block;
	overflow: hidden;
	height: 0;
	clear: both;
	content: ".";
}
.menu {
	position: relative;
	float: left;
	margin-right: 10px;
}
.menu .list, .menu .list li {
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
}
.menu .list {
	display: none;
	position: absolute;
	top: 24px;
	left: 0;
	background: #ccf;
}
.menu .list li {
	white-space: nowrap;
}
</style>
<div class="nav">
	<div class="menu">
		<span class="toggler">Menu 1</span>
		<ul class="list">
			<li><a href="#">Menu 1 item 1</a></li>
			<li><a href="#">Menu 1 item 2</a></li>
			<li><a href="#">Menu 1 item 3</a></li>
			<li><a href="#">Menu 1 item 4</a></li>
			<li><a href="#">Menu 1 item 5</a></li>
		</ul>
	</div>
	<div class="menu">
		<span class="toggler">Menu 2</span>
		<ul class="list">
			<li><a href="#">Menu 2 item 1</a></li>
			<li><a href="#">Menu 2 item 2</a></li>
			<li><a href="#">Menu 2 item 3</a></li>
			<li><a href="#">Menu 2 item 4</a></li>
			<li><a href="#">Menu 2 item 5</a></li>
		</ul>
	</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(function () {
	$(".menu .toggler").click(function () {
		var $list = $(this).next(".list").stop();
		$list.slideDown(100, function () {
			$(document).one("click", function () {
				$list.slideUp(100);
			})
		});
	});
});
</script>
Ответить с цитированием
  #19 (permalink)  
Старый 03.10.2010, 16:55
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

Сообщение от Octane
Зачем nodeName?
Для того чтобы можно перенести фокус на элемент, к примеру если он будет наполнен текстом и пр..
Ответить с цитированием
  #20 (permalink)  
Старый 04.10.2010, 01:30
Интересующийся
Отправить личное сообщение для arwprod Посмотреть профиль Найти все сообщения от arwprod
 
Регистрация: 11.09.2010
Сообщений: 20

Octane, да вот если зохочется внести форму в какой-то пункт меню, то трындец)))
monolithed, именно для этого)
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вызов функции, находящейся в другой функции ZneP Events/DOM/Window 6 24.08.2010 18:45
непонятный вызов функции hedgi Общие вопросы Javascript 2 05.08.2010 11:55
вызов функции из функции sharp_007 Общие вопросы Javascript 2 03.04.2010 21:13
Вызов функции из другой функции.. ?? glutton Общие вопросы Javascript 3 21.08.2009 22:33
вызов функции, из JS генерируемого на сервере subaru AJAX и COMET 1 12.07.2008 13:44