Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Проблема с панелью пользователя (https://javascript.ru/forum/events/31461-problema-s-panelyu-polzovatelya.html)

zevilz 08.09.2012 16:08

Проблема с панелью пользователя
 
Есть панель пользователя наверху страницы.
<div id="toppanel">
	<div id="panel"></div>
	<div class="login_tab">
             <span id="toggle">
	         <a id="open" class="open" href="#">Открыть</a>
	         <a id="close" style="display: none;" class="close" href="#">Закрыть</a>			
             </span>
        </div>
</div>

По умолчанию она скрыта на login_tab висит кнопка "открыть", при нажатии на нее панель открывается, кнопка открыть меняется на "закрыть". Выполняется это при помощи скрипта:

$(document).ready(function() {

	// Сворачиваем панель
	$("#close").click(function(){
		$("div#panel").slideUp("slow");	
	});		

	// Разворачиваем панель
	$("#open").click(function(){
		$("div#panel").slideDown("slow");
	
	});

	// Переключение кнопок при нажатии кнопки мыши
	$("#toggle a").click(function () {
		$("#toggle a").toggle();
	});		
		
});

Хочу реализовать закрытие панели при нажатии на любой области страницы кроме области панели. Никак не получается написать работоспособный код.
Попробовал написать так:
$("div#body").click(function(){
      $("div#panel").slideUp("slow");
      $("#toggle a").toggle();
});

Вроде работает, но только при клике на блоке #body
$("body").not("a#open").click(function(){
      $("div#panel").slideUp("slow");
      $("#toggle a").toggle();
});

Открывается и сразу закрывается
$("a").not("a#open").click(function(){
      $("div#panel").slideUp("slow");
      $("#toggle a").toggle();
});

Нормально открывается, но при попытке подставить еще условия отрывается и закрывается либо вообще не открывается.
Как правильно составить код? Заранее спасибо за ответы

cyber 08.09.2012 17:06

используйте события focus /blur

zevilz 08.09.2012 18:12

Не работает. Где косяк?
$("#toppanel").blur(function(){
	$("div#panel").slideUp("slow");
	$("#toggle a").toggle();
});

bes 08.09.2012 18:27

tabindex

zevilz 08.09.2012 18:34

всмысле? это то мне зачем?

bes 08.09.2012 18:37

чтобы div смог получать фокус, тогда и onblur будет

zevilz 08.09.2012 18:49

Спасибо, работает) Только вот рамка появилась при фокусе

bes 08.09.2012 18:53

outline-style: none

zevilz 08.09.2012 18:55

Рамку убрал, но сейчас если клавишей tab перемещаться по элементам кнопка "открыть" меняется на "закрыть"

cyber 08.09.2012 19:00

есть такая штука, поставьте tabindex = -1


Часовой пояс GMT +3, время: 21:52.