Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> Rozwijane menu
Balas
post 17.10.2005, 17:53:40
Post #1





Grupa: Zarejestrowani
Postów: 347
Pomógł: 0
Dołączył: 27.08.2005
Skąd: Inowrocław

Ostrzeżenie: (0%)
-----

Ktos pomoze kto sie zna questionmark.gif smile.gif

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html><head>
  3.  
  4. <style>
  5. .buttonA:VISITED {
  6.     font-family: Tahoma, Verdana, "MS Sans Serif", "Arial CE", Arial, Helvetica;
  7.     font-size: 8pt;
  8.     color: #FFFFFF;
  9.     text-decoration: none;
  10.     font-variant: normal;
  11.     font-weight: bold;
  12. }
  13.  
  14. .buttonA:HOVER {
  15.     font-family: Tahoma, Verdana, "MS Sans Serif", "Arial CE", Arial, Helvetica;
  16.     font-size: 8pt;
  17.     color: #FFFFFF;
  18.     text-decoration: none;
  19.     font-variant: normal;
  20.     font-weight: bold;
  21. }
  22.  
  23. .table_buttons {
  24. 	text-align: center;
  25. 	color: #FFFFFF;
  26.    background-color: #000000;
  27. }
  28.  
  29. .td_buttons { 
  30. 	border: 1px solid #CACACA;
  31. 	height: 18px;
  32. 	width:  78px;
  33. }
  34.  
  35. .menuskin{
  36. position:absolute;
  37. width:165px;
  38. background-color: #000000;
  39. border: 1px solid #CACACA;
  40. font-family: Tahoma, Verdana, "MS Sans Serif", "Arial CE", Arial, Helvetica;
  41. line-height:18px;
  42. z-index:100;
  43. visibility:hidden;
  44. }
  45.  
  46. .menuskin a{
  47. text-decoration:none;
  48. color: #ffffff;
  49. padding-left:10px;
  50. padding-right:10px;
  51. }
  52.  
  53. </style>
  54. <script>
  55. //Pop-it menu- By Dynamic Drive
  56. //For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
  57. //This credit MUST stay intact for use
  58.  
  59. var linkset=new Array()
  60. //SPECIFY MENU SETS AND THEIR LINKS. FOLLOW SYNTAX LAID OUT
  61.  
  62. linkset[0]='<div class="menuitems"><a class="buttonA">XXX</a></div>'
  63. linkset[0]+='<div class="menuitems"><a class="buttonA">YYY</a></div>'
  64. linkset[0]+='<div class="menuitems"><a class="buttonA">ZZZ</a></div>'
  65. linkset[0]+='<div class="menuitems"><a class="buttonA">NNN</a></div>'
  66.  
  67.  
  68. ////No need to edit beyond here
  69.  
  70. var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1
  71. var ns6=document.getElementById
  72. //var ns6=document.getElementById&&!document.all
  73. var ns4=document.layers
  74.  
  75. function findPosX(obj)
  76. {
  77. 	var curleft = 0;
  78. 	if (obj.offsetParent)
  79. 	{
  80.   while (obj.offsetParent)
  81.   {
  82.   	curleft += obj.offsetLeft
  83.   	obj = obj.offsetParent;
  84.   }
  85. 	}
  86. 	else if (obj.x)
  87.   curleft += obj.x;
  88. 	return curleft;
  89. }
  90.  
  91. function findPosY(obj)
  92. {
  93. 	var curtop = 0;
  94. 	if (obj.offsetParent)
  95. 	{
  96.   while (obj.offsetParent)
  97.   {
  98.   	curtop += obj.offsetTop
  99.   	obj = obj.offsetParent;
  100.   }
  101. 	}
  102. 	else if (obj.y)
  103.   curtop += obj.y;
  104. 	return curtop;
  105. }
  106.  
  107. function showmenu(e,which, leftpos, toppos, abspos){
  108.  
  109. if (!document.all&&!document.getElementById&&!document.layers)
  110. return
  111.  
  112. clearhidemenu()
  113.  
  114. var targ;
  115.  
  116. if (!e) var e = window.event;
  117. if (e.target)
  118. 	targ = e.target;
  119. else if (e.srcElement)
  120. 	targ = e.srcElement;
  121.  
  122. if (targ.tagName != 'TD') return
  123.  
  124. menuobj=ie4? document.all.popmenu : ns6? document.getElementById("popmenu") : ns4? document.popmenu : ""
  125. menuobj.thestyle=(ie4||ns6)? menuobj.style : menuobj
  126.  
  127. if (ie4||ns6)
  128. menuobj.innerHTML=which
  129. else{
  130. menuobj.document.write('<layer name=gui bgColor=#E6E6E6 width=165 onmouseover="clearhidemenu()" onmouseout="hidemenu()">'+which+'</layer>')
  131. menuobj.document.close()
  132. }
  133.  
  134. menuobj.contentwidth=(ie4||ns6)? menuobj.offsetWidth : menuobj.document.gui.document.width
  135. menuobj.contentheight=(ie4||ns6)? menuobj.offsetHeight : menuobj.document.gui.document.height
  136.  
  137. eventX=ie4? event.clientX-event.offsetX+30 : ns6? findPosX(targ)+30 : e.x;
  138. eventY=ie4? event.clientY-event.offsetY+15 : ns6? findPosY(targ)+18 : e.y;
  139.  
  140. //Find out how close the mouse is to the corner of the window
  141. var rightedge=ie4? document.body.clientWidth-eventX : window.innerWidth-eventX;
  142. var bottomedge=ie4? document.body.clientHeight-eventY : window.innerHeight-eventY;
  143.  
  144. //if the horizontal distance isn't enough to accomodate the width of the context menu
  145. if (rightedge<menuobj.contentwidth)
  146. //move the horizontal position of the menu to the left by it's width
  147. menuobj.thestyle.left=ie4? document.body.scrollLeft+eventX-menuobj.contentwidth : eventX-menuobj.contentwidth
  148. else
  149. //position the horizontal position of the menu where the mouse was clicked
  150. menuobj.thestyle.left=ie4? document.body.scrollLeft+eventX : eventX
  152. //same concept with the vertical position
  153. if (bottomedge<menuobj.contentheight)
  154. menuobj.thestyle.top=ie4? document.body.scrollTop+eventY : eventY;
  155. //menuobj.thestyle.top=ie4? document.body.scrollTop+eventY-menuobj.contentheight : eventY-menuobj.contentheight;
  156. else
  157. menuobj.thestyle.top=ie4? document.body.scrollTop+eventY : eventY;
  158. menuobj.thestyle.visibility="visible";
  159. return false
  160. }
  162. function contains_ns6(a, b) {
  163. //Determines if 1 element in contained in another- by Brainjar.com
  164. while (b.parentNode)
  165. if ((b = b.parentNode) == a)
  166. return true;
  167. return false;
  168. }
  170. function hidemenu(){
  171. if (window.menuobj)
  172. menuobj.thestyle.visibility=(ie4||ns6)? "hidden" : "hide"
  173. }
  175. function dynamichide(e){
  176. if (ie4&&!menuobj.contains(e.toElement))
  177. hidemenu()
  178. else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
  179. hidemenu()
  180. }
  182. function delayhidemenu(){
  183. if (ie4||ns6||ns4)
  184. delayhide=setTimeout("hidemenu()",1)
  185. }
  187. function clearhidemenu(){
  188. if (window.delayhide)
  189. clearTimeout(delayhide)
  190. }
  192. function highlightmenu(e,state){
  193. if (document.all)
  194. source_el=event.srcElement
  195. else if (document.getElementById)
  196. source_el=e.target
  197. if (source_el.className=="menuitems"){
  198. source_el.id=(state=="on")? "mouseoverstyle" : ""
  199. }
  200. else{
  201. while(source_el.id!="popmenu"){
  202. source_el=document.getElementById? source_el.parentNode : source_el.parentElement
  203. if (source_el.className=="menuitems"){
  204. source_el.id=(state=="on")? "mouseoverstyle" : ""
  205. }
  206. }
  207. }
  208. }
  210. //if (ie4||ns6)
  211. //document.onclick=hidemenu
  213. </script>
  214. <body bgcolor="#ffffff">
  215.  
  216.  
  217. <div style="left: 131px; top: 161px; visibility: hidden;" id="popmenu" class="menuskin" onmouseover="clearhidemenu();highlightmenu(event,'on')" onmouseout="highlightmenu(event,'off');dynamichide(event)"></div>
  218.  
  219.  
  220.  
  221.  
  222.  
  223. <table border="0" cellpadding="0" cellspacing="0" width="800">
  224. <tbody><tr valign="top">
  225. <td colspan="1" width="468">
  226. <table class="table_buttons" border="0" cellpadding="0" cellspacing="0">
  227. <tbody><tr valign="top">
  228. <td class="td_buttons" title="Nasze programy" onclick='this.bgColor="F7941D";showmenu(event,linkset[0], 30, 20, 143)' onmouseout='this.bgColor="000000";delayhidemenu()' bgcolor="#000000">TEST1</td>
  229. </tr>
  230.  
  231. </body></html>
[HTML] pobierz, plaintext


Mam takie cos smile.gif Tylko jak zrobic zeby sie chowało nie po wyjechaniu tylko po ponownym nacisnieciu przycisku questionmark.gif smile.gif

Ten post edytował OnE.Killer 19.10.2005, 17:14:44


--------------------
Go to the top of the page
+Quote Post
« Następny starszy · JavaScript · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 12.06.2025 - 19:36
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn