| 119 |
ghuddy |
1 |
/*
|
|
|
2 |
* DROPDOWN MENU
|
|
|
3 |
*/
|
|
|
4 |
|
|
|
5 |
var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1
|
|
|
6 |
var ns6=(document.getElementById&&!document.all)||navigator.userAgent.indexOf("Opera")==0
|
|
|
7 |
var ns4=document.layers
|
| 6610 |
dpurdie |
8 |
var menuobj;
|
| 119 |
ghuddy |
9 |
|
|
|
10 |
function showmenu(e,which){
|
|
|
11 |
|
|
|
12 |
if (!document.all&&!document.getElementById&&!document.layers)
|
|
|
13 |
return
|
|
|
14 |
|
|
|
15 |
clearhidemenu()
|
|
|
16 |
|
| 6610 |
dpurdie |
17 |
if (!menuobj){
|
|
|
18 |
menuobj = document.getElementById('popmenu');
|
|
|
19 |
if (!menuobj) {
|
|
|
20 |
menuobj = document.createElement('div');
|
|
|
21 |
menuobj.className = 'menuskin';
|
|
|
22 |
menuobj.onmouseover=function(event){clearhidemenu();highlightmenu(event,'on')};
|
|
|
23 |
menuobj.onmouseout=function(event){highlightmenu(event,'off');dynamichide(event)};
|
|
|
24 |
menuobj.id = 'popmenu';
|
|
|
25 |
document.body.appendChild(menuobj);
|
|
|
26 |
}
|
|
|
27 |
}
|
|
|
28 |
|
| 119 |
ghuddy |
29 |
menuobj=ie4? document.all.popmenu : ns6? document.getElementById("popmenu") : ns4? document.popmenu : ""
|
|
|
30 |
menuobj.thestyle=(ie4||ns6)? menuobj.style : menuobj
|
|
|
31 |
|
|
|
32 |
if (ie4||ns6)
|
|
|
33 |
menuobj.innerHTML=which
|
|
|
34 |
else{
|
|
|
35 |
menuobj.document.write('<layer name=gui bgColor=#E6E6E6 width=165 onmouseover="clearhidemenu()" onmouseout="hidemenu()">'+which+'</layer>')
|
|
|
36 |
menuobj.document.close()
|
|
|
37 |
}
|
|
|
38 |
|
|
|
39 |
menuobj.contentwidth=(ie4||ns6)? menuobj.offsetWidth : menuobj.document.gui.document.width
|
|
|
40 |
menuobj.contentheight=(ie4||ns6)? menuobj.offsetHeight : menuobj.document.gui.document.height
|
| 3959 |
dpurdie |
41 |
//eventX=ie4? event.clientX : ns6? e.clientX : e.x
|
|
|
42 |
//eventY=ie4? event.clientY : ns6? e.clientY : e.y
|
| 119 |
ghuddy |
43 |
|
| 3959 |
dpurdie |
44 |
// Dont use event location as it wobbles around
|
|
|
45 |
// Use location of parent element
|
|
|
46 |
var targ;
|
|
|
47 |
if (e.target) targ = e.target;
|
|
|
48 |
else if (e.srcElement) targ = e.srcElement;
|
|
|
49 |
if (targ.nodeType == 3) // defeat Safari bug
|
|
|
50 |
targ = targ.parentNode;
|
|
|
51 |
var rect = targ.getBoundingClientRect();
|
|
|
52 |
eventX = rect.left;
|
|
|
53 |
eventY = rect.bottom;
|
|
|
54 |
|
| 119 |
ghuddy |
55 |
//Find out how close the mouse is to the corner of the window
|
| 3959 |
dpurdie |
56 |
var rightedge=(document.body.clientWidth||window.innerWidth)-eventX;
|
|
|
57 |
var bottomedge=(document.body.clientHeight||window.innerHeight)-eventY;
|
| 119 |
ghuddy |
58 |
|
|
|
59 |
//position the horizontal position of the menu where the mouse was clicked
|
| 3959 |
dpurdie |
60 |
var left=ie4? document.body.scrollLeft+eventX : ns6? window.pageXOffset+eventX : eventX
|
| 119 |
ghuddy |
61 |
|
| 3959 |
dpurdie |
62 |
//if the horizontal distance isn't enough to accomodate the width of the context menu
|
|
|
63 |
var delta = rightedge - menuobj.contentwidth;
|
|
|
64 |
if ( delta < 0 ) left+=delta;
|
|
|
65 |
|
| 119 |
ghuddy |
66 |
//same concept with the vertical position
|
| 3959 |
dpurdie |
67 |
var top = menuobj.thestyle.top=ie4? document.body.scrollTop+eventY : ns6? window.pageYOffset+eventY : eventY
|
|
|
68 |
|
|
|
69 |
// Don't adjust top. Assume menus are at the top. All adjusting will do is push the top off the screen
|
|
|
70 |
//delta = bottomedge-menuobj.contentheight;
|
|
|
71 |
//if (delta < 0) top += delta;
|
|
|
72 |
|
| 5114 |
dpurdie |
73 |
menuobj.thestyle.left=left+'px';
|
|
|
74 |
menuobj.thestyle.top=top+'px';
|
| 119 |
ghuddy |
75 |
menuobj.thestyle.visibility="visible"
|
| 6591 |
dpurdie |
76 |
|
|
|
77 |
// Stop onClick event propagating
|
|
|
78 |
if (!e)
|
|
|
79 |
e = window.event;
|
|
|
80 |
|
|
|
81 |
//IE9 & Other Browsers
|
|
|
82 |
if (e.stopPropagation) {
|
|
|
83 |
e.stopPropagation();
|
|
|
84 |
}
|
|
|
85 |
//IE8 and Lower
|
|
|
86 |
else {
|
|
|
87 |
e.cancelBubble = true;
|
|
|
88 |
}
|
| 119 |
ghuddy |
89 |
return false
|
|
|
90 |
}
|
|
|
91 |
|
|
|
92 |
function contains_ns6(a, b) {
|
|
|
93 |
//Determines if 1 element in contained in another- by Brainjar.com
|
|
|
94 |
while (b && b.parentNode)
|
|
|
95 |
if ((b = b.parentNode) == a)
|
|
|
96 |
return true;
|
|
|
97 |
return false;
|
|
|
98 |
}
|
|
|
99 |
|
|
|
100 |
function hidemenu(){
|
|
|
101 |
if (window.menuobj)
|
|
|
102 |
menuobj.thestyle.visibility=(ie4||ns6)? "hidden" : "hide"
|
|
|
103 |
}
|
|
|
104 |
|
|
|
105 |
function dynamichide(e){
|
|
|
106 |
if (ie4&&!menuobj.contains(e.toElement))
|
|
|
107 |
hidemenu()
|
|
|
108 |
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
|
|
|
109 |
hidemenu()
|
|
|
110 |
}
|
|
|
111 |
|
|
|
112 |
function delayhidemenu(){
|
|
|
113 |
if (ie4||ns6||ns4)
|
|
|
114 |
delayhide=setTimeout("hidemenu()",500)
|
|
|
115 |
}
|
|
|
116 |
|
|
|
117 |
function clearhidemenu(){
|
|
|
118 |
if (window.delayhide)
|
|
|
119 |
clearTimeout(delayhide)
|
|
|
120 |
}
|
|
|
121 |
|
|
|
122 |
function highlightmenu(e,state){
|
|
|
123 |
if (document.all)
|
| 6592 |
dpurdie |
124 |
source_el=event.srcElement
|
| 119 |
ghuddy |
125 |
else if (document.getElementById)
|
| 6592 |
dpurdie |
126 |
source_el=e.target
|
|
|
127 |
if (source_el.className.indexOf("menuitems") >= 0 ){
|
|
|
128 |
source_el.id=(state=="on")? "mouseoverstyle" : "";
|
| 119 |
ghuddy |
129 |
}
|
|
|
130 |
else{
|
| 6592 |
dpurdie |
131 |
while(source_el.id!="popmenu"){
|
|
|
132 |
source_el=document.getElementById? source_el.parentNode : source_el.parentElement
|
|
|
133 |
if (source_el.className.indexOf("menuitems") >= 0){
|
|
|
134 |
source_el.id=(state=="on")? "mouseoverstyle" : "";
|
|
|
135 |
}
|
|
|
136 |
}
|
| 119 |
ghuddy |
137 |
}
|
|
|
138 |
}
|
|
|
139 |
|
|
|
140 |
if (ie4||ns6)
|
|
|
141 |
document.onclick=hidemenu
|