<b>REGISTER</b>

GFX-Sector - HTML, CSS


 
GFX-Sector » Coding Area » Webentwicklung » HTML, CSS » DRopdown Menü mit CSS » Hello Guest [Login|Register]
Last Post | First Unread Post Print Page | Recommend to a Friend | Add Thread to Favorites

HTML, CSS

Einfache Scriptsprachen und deren Layout mit HTML und CSS
Post New Thread Post Reply

DRopdown Menü mit CSS

     Deutsche Version  English version
Author
Post « Previous Thread | Next Thread »

kunsti kunsti is a male
Designartist


Avatar von kunsti

Registration Date: 05.07.2008
Posts: 1,401
Location: Hessen
Deviantart: kunsti

Spacer
DRopdown Menü mit CSS

DRopdown Menü mit CSS

      

Hi ich habe im Inet en Dropdownmenü gefunden. Da ich sowas nicht so gut kann wolltte ich mal Fragen wo mein Fehler ist.
Ich hab den Test so Kopiert wie er da stand undhab nur die Farben geändert.
Wenn ich es mit IE öffne verschwindet die LEite einfach wenn ich auf nen link klicken will.


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:
<html>
<head>
<title></title>


<style type="text/css">
#menuebox {
position: relative;
height: 30px;
}
.stupidie {
display: none;
}
#menue {
position:absolute;
top: 5px;
left: 0;
z-index: 200;
}

#menue .aussen {
float: left;
display: block;
overflow: hidden;
width: 8em;
height: 1.3em;
font-weight: bold;
text-align: center;
background-color: #dec79a;
color: #513913;
border: 1px solid;
border-color: #000e3d #000e3d #000e3d #000e3d;
}
#menue .aussen:hover {
height: auto;
background-color: #624617;
color: #fff;
}

a.innen-1 {
margin-top: 2px;
}
a.innen,
a.innen-1 {
display: block;
width: 7.9em;
padding: 2px 0;
text-decoration: none;
font-weight: normal;
border-bottom: 1px solid #78561d;
background-color: #ecd8ae;
color: #600;
}
a:visited.innen,
a:visited.innen-1 {
background-color: #ecd8ae;
color:#555;
}
a:hover.innen,
a:hover.innen-1 {
background-color: #f7eedb;
color: #900;
}

span.menutag {
display: block;
cursor: default;
}



*/

#menue {
display:none;
}
.stupidie {
display: block;
position: absolute;
top: 5px;
left: 0;
z-index: 200;
}

a.auss {
float: left;
width: 8em;
height: 1.4em;
overflow: hidden;
display: block;
font-weight: bold;
text-align: center;
text-decoration: none;
background-color: #68718c;
color: #d2ddff;
border: 1px solid;
border-color: #000e3d #000e3d #000e3d #000e3d;
}
a:hover.auss {
overflow: visible;
background-color: #2a2d5d;
color: #fff;
}
a:hover.auss table {
display: block;
margin-top: 3px;
background-color: #dec79a;
color: #400;
border-collapse: collapse ;

}

a.inn {
display: block;
width: 7.9em; /* fuer 5er IEs anpassen, sonst 'zuckt' es */
padding: 2px 0;
font-size: 100%; /* fuer 5er IEs auf 80% reduzieren */
font-weight: normal;
text-align: center;
text-decoration: none;
border-bottom: 1px solid #000e3d;
background-color: #68718c;
color: #600;
}
a:visited.inn {
background-color: #68718c;
color:#444;
}
a:hover.inn {
position: relative;
background-color: #68718c;
color: #900;
}
span.menutag {
display: block;
cursor: default;
}
</style>

<body text="#000000" bgcolor="#050f1c" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr><td colspan="2"><img src="Header.gif"></td></tr>
<tr><td>
<div id="menuebox">

	<div id="menue">
		<div class="aussen">
<span class="menutag">Produkte</span>
<a class="innen-1" href="#">Systeme</a>
<a class="innen" href="#">Speicher</a>
<a class="innen" href="#">Laufwerke</a>
<a class="innen" href="#">Monitore</a>
<a class="innen" href="#">Drucker</a>
<a class="innen" href="#">Zubehör</a>
		</div>
		<div class="aussen">
<span class="menutag">Multimedia</span>
<a class="innen-1" href="#">Musik</a>
<a class="innen" href="#">Folgen</a>
<a class="innen" href="#">Filme</a>
<a class="innen" href="#">Manga</a>
		</div>
		<div class="aussen">
<span class="menutag">Service</span>
<a class="innen-1" href="#">Reparatur</a>
<a class="innen" href="#">Konfiguration</a>
<a class="innen" href="#">Software</a>
<a class="innen" href="#">Schulung</a>
		</div>
		<div class="aussen">
<span class="menutag">Links</span>
<a class="innen-1" href="#">About Us</a>
<a class="innen" href="#">Partner</a>
<a class="innen" href="#">Referenzen</a>
		</div>
	</div><!-- menue -->

<!-- Der folgende Block bedient nur IEs!
	 Durch diese Redundanz vermeiden wir den Einsatz von Javascript. -->

<!--[if IE]>
	<div class="stupidie">
<a class="auss" href="#"><span class="menutag">Produkte</span>
<table><tr><td>
<a class="inn" href="#">Systeme</a>
<a class="inn" href="#">Speicher</a>
<a class="inn" href="#">Laufwerke</a>
<a class="inn" href="#">Monitore</a>
<a class="inn" href="#">Drucker</a>
<a class="inn" href="#">Zubehör</a>
</td></tr></table>
</a>
<a class="auss" href="#"><span class="menutag">Leistungen</span>
<table><tr><td>
<a class="inn" href="#">Netzwerke</a>
<a class="inn" href="#">Server</a>
<a class="inn" href="#">Wartung</a>
</td></tr></table>
</a>
<a class="auss" href="#"><span class="menutag">Service</span>
<table><tr><td>
<a class="inn" href="#">Reparatur</a>
<a class="inn" href="#">Konfiguration</a>
<a class="inn" href="#">Software</a>
<a class="inn" href="#">Schulung</a>
</td></tr></table>
</a>
<a class="auss" href="#"><span class="menutag">Links</span>
<table><tr><td>
<a class="inn" href="#">About Us</a>
<a class="inn" href="#">Partner</a>
<a class="inn" href="#">Referenzen</a>
</td></tr></table>
</a>
	</div><!-- stupidie -->
<![endif]-->

</div><!-- menuebox -->
<td>



thx Nischi
DRopdown Menü mit CSS 12.08.2008 20:28 kunsti is offline Search for Posts by kunsti

Mero Mero is a male
The Dreadworks Project

Spender


Avatar von Mero

Registration Date: 12.11.2006
Posts: 3,294
Location: Weserbergland
Program: Photoshop, Illustrator, Notepad++
Deviantart: dreadworks

Spacer
      

habs jetzt nur überflogen... aber

"Durch diese Redundanz vermeiden wir den Einsatz von Javascript."

steht im ie block...
das javascript wird dazu benutzt das menu auszufahren... kein javascript, kein menu...

ich finde den skript den du da gezogen hast, auch nicht sonderlich toll... also ich verstehe nicht, warum man eine nonjavascript version für den ie macht?



.
The Dreadworks Project

And in my darkest moment, fetal and weeping
The moon tells me a secret - my confidant
As full and bright as I am
This light is not my own and
A million light reflections pass over me

DRopdown Menü mit CSS 12.08.2008 20:55 Mero is offline Homepage of Mero Search for Posts by Mero

kunsti kunsti is a male
Designartist


Avatar von kunsti

Registration Date: 05.07.2008
Posts: 1,401
Location: Hessen
Deviantart: kunsti

Thread Starter Thread Started by kunsti
Spacer
      

Ok also eins mit JS suchen oder hat vllt jemand eins?^^




thx Nischi
DRopdown Menü mit CSS 12.08.2008 21:16 kunsti is offline Search for Posts by kunsti

RedFox RedFox is a male
Buntstiftmaler


Avatar von RedFox

Registration Date: 26.01.2008
Posts: 76

Spacer
      

einfach DAS mal durchlesen...

DRopdown Menü mit CSS 13.08.2008 10:07 RedFox is offline Search for Posts by RedFox
 
Spacer
   
GFX-Sector
unregistered


 hat kein Avatar


Spacer

Have you enjoyed this topic?


If you were enjoying this post and if you keen on reading more interesting stuff then do not hesitate to complete the free sign up.

After the free registration you will gain access to all areas and you will be able to communicate with other artists from all over the world.

In addition you will benefit from our Photoshop and coding section as well as from our huge (hundreds of gigabytes) free resource section where you can find everything you will need to be a successful (web) designer/artist.

Sign up now and enjoy the advantages as a registered member.

(This website will be ad-free after a complete free sign up.)

New Post 13.08.2008 10:07  
Tree Structure | Board Structure
Post New Thread Post Reply
GFX-Sector » Coding Area » Webentwicklung » HTML, CSS » DRopdown Menü mit CSS

Similar topics to DRopdown Menü mit CSS
Thread
[Hilfe]HTML+CSS Problem (Forum: HTML, CSS)
1 Attachments attached Wiese mit 2 bäumen und einem fels (Forum: Signaturen/Avatare)
dynamite vs Ava (Forum: 1on1-Archiv)
[Frage] Kann man mit Photoshop cs4 Visualisierung erstellen? (Forum: Fragen & Probleme)
First Wallpaper done mit Render (Forum: Wallpaper)