Witam!

Podczas tworzenia menu nawigacyjnego do swojej strony, napotkalem nastepujace problemy:

1. Aby otworzyc menu zwyklym onClick'iem, nalezy kliknac button az dwa razy - niestety za pierwszym kompletnie nic sie nie dzieje, co moze byc nie tak ?

2. Klikniecie tla elementu w menu powoduje zamkniecie menu. Mozna to zauwazyc na przykladzie "Menu 1", gdzie "1" to rodzic, a "2" i "3" to elementy podlegle. Probowalem przeroznych sposobow aby klikniecie tych elementow nie powodowalo chowania menu, mimo ze moje starania spelzly na niczym, nasunal mi sie prosty wniosek. Przyczyna jest osadzenie elementow menu w znacznikach. Pytanie brzmi wiec, jak brac pod uwage divy zawarte w divie ?

Chodzi o ta funkcje:
[HTML] pobierz, plaintext 
  1. document.onclick = function(e) {
  2.  
  3. 			var obj = document.all ? event.srcElement : e.target;
  4.  
  5. 			if (obj != menu_id && obj != ch) 
  6. 			{
  7.  
  8. 				var opened_menu  = registered_menus.pop();
  9. 				var close_menu_id = document.getElementById("sub" + opened_menu);
  10. 				close_menu_id.style.display = "none";
  11.  
  12. 				return false;
  13.  
  14. 			}
  15. 		}
[HTML] pobierz, plaintext


Link do menu: klik.

Caly kod:
[HTML] pobierz, plaintext 
  1. <script type="text/javascript"> 
  2.  
  3. 	var registered_menus = Array();
  4.  
  5. 	////////////////////////
  6. 	// Pokaz / ukryj menu
  7. 	////////////////////////
  8.  
  9.  
  10.  
  11. 	function showMenu(ch) {
  12.  
  13. 		var menu_ident	= ch.id;
  14. 		var menu_name	= "sub" + menu_ident;
  15. 		var menu_id  	= document.getElementById(menu_name);
  16. 		var menu_width    = menu_id.style.width.substring(0,3); 	
  17. 		var button_width  = document.getElementById(menu_ident).offsetWidth; 
  18. 		var button_height = document.getElementById(menu_ident).offsetHeight;
  19.  
  20. 		document.onclick = function(e) {
  21.  
  22. 			var obj = document.all ? event.srcElement : e.target;
  23.  
  24. 			if (obj != menu_id && obj != ch) 
  25. 			{
  26.  
  27. 				var opened_menu  		= registered_menus.pop();
  28. 				var close_menu_id 	= document.getElementById("sub" + opened_menu);
  29. 				close_menu_id.style.display	= "none";
  30.  
  31. 				return false;
  32.  
  33. 			}
  34.  
  35.     		}
  36.  
  37. 		if (menu_id.style.display == 'none') 
  38. 		{ 
  39.  
  40. 			var opened_menu  		= registered_menus.pop();
  41. 			var close_menu_id 	= document.getElementById("sub" + opened_menu);
  42.  
  43. 			if (opened_menu != null) 
  44. 			{
  45.  
  46. 				close_menu_id.style.display = "none"; 
  47.  
  48. 			}
  49.  
  50. 			registered_menus.push(ch.id) 
  51. 			menu_id.style.left    = getposOffset(ch, 'left');
  52. 			menu_id.style.top     = getposOffset(ch, 'top') + button_height + "px"; 
  53. 			menu_id.style.display = "block"; 
  54.  
  55. 			return false; 
  56.  
  57. 		} 
  58. 		else 
  59. 		{ 
  60.  
  61. 			menu_id.style.display = "none" 
  62.  
  63. 			return false; 
  64. 		} 
  65. 	} 
  66.  
  67. 	///////////////////////////
  68. 	// Ustal wspolrzedne menu 
  69. 	///////////////////////////
  70.  
  71. 	function getposOffset(ch, t) { 
  72.  
  73.       	var totaloffset = (t == 'top') ? ch.offsetTop : ch.offsetLeft; 
  74.       	var offParent = ch.offsetParent; 
  75.  
  76. 	      while (offParent != null) 
  77. 		{ 
  78.  
  79.       		if(t == 'left') 
  80. 			{ 
  81.  
  82. 				totaloffset = totaloffset + offParent.offsetLeft; 
  83.  
  84. 			} 
  85. 	   		else 
  86. 	   		{ 
  87.  
  88.             		totaloffset = totaloffset + offParent.offsetTop; 
  89.  
  90. 			} 
  91.  
  92. 			offParent = offParent.offsetParent; 
  93.  
  94. 		} 
  95.  
  96. 		return totaloffset; 
  97.  
  98.   	} 
  99.  
  100.  
  101. </script>
  102.  
  103. <span id="_menu_1" class="menu_button" onClick="showMenu(this);">Menu 1</span>
  104. <span id="_menu_2" class="menu_button" onClick="showMenu(this);">Menu 2</span>
  105.  
  106.  
  107. <div id="sub_menu_1" class="menu">1.
  108. 	<div class="menu_option" onclick="">2.<a href="#">Odnosnik 1</a><br></div>
  109. 	<div class="menu_option" onclick="">3.<a href="#">Odnosnik 2</a><br></div>
  110. </div>
  111.  
  112. <div id="sub_menu_2" class="menu">
  113. 	<div class="menu_option" onclick=""><a href="#">Odnosnik 1</a><br></div>
  114. 	<div class="menu_option" onclick=""><a href="#">Odnosnik 2</a><br></div>
  115. </div>
[HTML] pobierz, plaintext