Gegen Bilderklau - Das Original | Druckvorschau: Drop-down Menü

Gegen Bilderklau - Das Original (https://www.gegen-bilderklau.net/index.php)
- Design, Website, Copyright (https://www.gegen-bilderklau.net/board.php?boardid=80)
--- Homepagehilfe (https://www.gegen-bilderklau.net/board.php?boardid=27)
---- Homepagehilfe - Archiv (https://www.gegen-bilderklau.net/board.php?boardid=139)
----- [HTML] Drop-down Menü (https://www.gegen-bilderklau.net/thread.php?threadid=177660)

Geschrieben von *Emma am 23.12.2010 um 15:00:

dankesschön fröhlich

habs auch ausprobiert, daber irgendwie funktiionierts nicht:

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124:
125:
126:
127:
128:
129:
130:
131:
132:
133:
134:
135:
136:
137:
138:
139:
140:
141:
142:
143:
144:
145:
146:
147:
148:
149:
150:
151:
152:
153:
154:
155:
156:
157:
158:
159:
160:
161:
162:
163:
164:
165:
166:
167:
168:
169:
170:
171:
172:
173:
174:
175:
176:
177:
178:
179:
180:
181:
182:
183:
184:
185:
186:
187:
188:
189:
190:
191:
192:
193:
194:
195:
196:
197:
198:
199:
200:
201:
202:
203:
204:
205:
206:
207:
208:
209:
210:
211:
212:
213:
214:
215:
216:
217:
218:
219:
220:
221:
222:
223:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

  <link rel="stylesheet" href="http://gswaldenstein.bplaced.net/Winter09/CSS.css" type="text/css">
  <title>menu_neu</title>

<script type="text/javascript">

//Dies sind die Links, die in den Menüs angezeigt werden

//Inhalt Menü1 Bei uns ist das home
var menu1=new Array()
menu1[0]='<a href="http://www.test.com">Startseite</a>'
menu1[1]='<a href="http://www.test.com">Kontakt</a>'
menu1[2]='<a href="http://www.test.com">Impressum</a>'
menu1[3]='<a href="http://www.test.com">Bildernachweis</a>'
menu1[4]='<a href="http://www.test.com">Forum</a>'



//Inhalt Menü2 Bei uns ist das Webmiss
var menu2=new Array()
menu2[0]='<a href="http://www.test.com">Faq´s</a>'
menu2[1]='<a href="http://www.test.com">Regeln</a>'
menu2[3]='<a href="http://www.test.com">Schulpferde</a>'
menu2[4]='<a href="http://www.test.com">Formulare</a>'

//Inhalt Menü3 Bei uns ist das Other
var menu3=new Array()
menu3[0]='<a href="http://www.test.com">Übersicht</a>'
menu3[1]='<a href="http://www.test.com">Anlagen</a>'
menu3[2]='<a href="http://www.test.com">Stallungen</a>'
menu3[3]='<a href="http://www.test.com">Koppeln</a>'
menu3[4]='<a href="http://www.test.com">Umgebung</a>'
menu3[5]='<a href="http://www.test.com">Hofkonto</a>'
menu3[6]='<a href="http://www.test.com">Hoftiere</a>'

//Inhalt Menü4 Bei uns ist das Other
var menu4=new Array()
menu4[0]='<a href="http://www.test.com">Bank</a>'
menu4[1]='<a href="http://www.test.com">Reiterladen</a>'
menu4[2]='<a href="http://www.test.com">Futterhändler</a>'
menu4[3]='<a href="http://www.test.com">Arbeitsamt</a>'
menu4[4]='<a href="http://www.test.com">Tierarzt</a>'
menu4[5]='<a href="http://www.test.com">Hufschmied</a>'


//Inhalt Menü5 Bei uns ist das Other
var menu5=new Array()
menu5[0]='<a href="http://www.test.com">Verkaufspferde</a>'
menu5[1]='<a href="http://www.test.com">Privatpferde</a>'
menu5[2]='<a href="http://www.test.com">Kosten</a>'
menu5[3]='<a href="http://www.test.com">Statistik</a>'


//Inhalt Menü6 Bei uns ist das Other
var menu5=new Array()
menu6[0]='<a href="http://www.test.com">Verzeichnis</a>'
menu6[1]='<a href="http://www.test.com">Auf Probe</a>'
menu6[2]='<a href="http://www.test.com">Geburtstage</a>'
menu6[3]='<a href="http://www.test.com">Staten</a>'
menu6[4]='<a href="http://www.test.com">Reitniveau</a>'

//Inhalt Menü7 Bei uns ist das Other
var menu5=new Array()
menu7[0]='<a href="http://www.test.com">Abzeichen</a>'
menu7[1]='<a href="http://www.test.com">Lizenzen</a>'
menu7[2]='<a href="http://www.test.com">Reitunterricht</a>'
menu7[3]='<a href="http://www.test.com">Spiele</a>'
menu7[4]='<a href="http://www.test.com">MdM&PdM</a>'

//Inhalt Menü8 Bei uns ist das Sonstiges
var menu8=new Array()
menu8[0]='<a href="http://www.test.com">Awards</a>'
menu8[1]='<a href="http://www.test.com">Partnerhöfe</a>'
menu8[2]='<a href="http://www.test.com">Designfriedhof</a>'
menu8[3]='<a href="http://www.test.com">Turniere</a>'



var menuwidth='165px' //Die Breite des Menüs
var menubgcolor='#FFA8C5' //Hintergrundfarbe
var disappeardelay=250 //Wie schnell das Menü verschwindet wenn man wegfährt mit der Maus(in msec)
var hidemenu_onclick="yes" //Ob das Menü verschwindet, wenn man woanderst hin klickt

/////Ab hier bitte stehen lassen!! ausser ihr habt Ahnung xD

var ie4=document.all
var ns6=document.getElementById&&!document.all

if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')

function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}


function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top="-500px"
if (menuwidth!=""){
dropmenuobj.widthobj=dropmenuobj.style
dropmenuobj.widthobj.width=menuwidth
}
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
}

function populatemenu(what){
if (ie4||ns6)
dropmenuobj.innerHTML=what.join("")
}


function dropdownmenu(obj, e, menucontents, menuwidth){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)

if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}

return clickreturnvalue()
}

function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}

function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}

function delayhidemenu(){
if (ie4||ns6)
delayhide=setTimeout("hidemenu()",disappeardelay)
}

function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}

if (hidemenu_onclick=="yes")
document.onclick=hidemenu

</script>

<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '150px')" onMouseout="delayhidemenu()">Allgemeines</a> |
<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu2, '150px')" onMouseout="delayhidemenu()">Bewerbung</a> |
<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu3, '150px')" onMouseout="delayhidemenu()">Das Gestüt</a> |
<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu4, '150px')" onMouseout="delayhidemenu()">Das Dorf</a> |
<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu5, '150px')" onMouseout="delayhidemenu()">Pferde</a> |
<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu6, '150px')" onMouseout="delayhidemenu()">Mitglieder</a> |
<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu7, '150px')" onMouseout="delayhidemenu()">Aktivitäten</a> |
<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu8, '150px')" onMouseout="delayhidemenu()">Sonstiges</a> 

</head>

</body>
</html>