Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit

Menü dynamisch? Fehlerkorrektur?

Frage Entwicklung HTML

Mitglied: 53111

53111 (Level 1)

21.09.2007, aktualisiert 15:53 Uhr, 3223 Aufrufe, 1 Kommentar

Hallo ich habe folgendes Problem: ich möchte eine Menüvorlage die ich über google (http://webdaum.de/html/portfolio/musterseiten/dynamisch/dyn_navi.htm) gefunden haben etwas verändern.

das menü soll senkrecht aufgebaut sein und die untermenüs seitlich/rechts davon ausklappen. ich habe nun folgende veränderungen vorgenommen. das hauptmenü ist soweit in ordnung. nur leider bekomme ich das untermenü nicht weiter nach rechts.

außerdem schein das untermenü auch auszuklappen wenn nicht auf das hauptmenü sonder an die stelle des untermenüs klickt. das war aber auch in der volage so.

css:
01.
 
02.
/* Navigation Links (TOP-Level)*/ 
03.
 
04.
a.navi { 
05.
 border:1px solid #666; 
06.
 border-left:0; 
07.
 width:400px; 
08.
 z-index:4; 
09.
10.
 
11.
a.navi:link, a.navi:visited { 
12.
 display:block; 
13.
 padding:3px; 
14.
 width:200px; 
15.
 height:77px; 
16.
 color:#CDCDCD; 
17.
18.
 
19.
 a.navi:active, a.navi:hover { 
20.
 text-decoration:none; 
21.
 color:#000000; 
22.
 background-color:#ffffff; 
23.
 width:200px; 
24.
25.
 
26.
/* Menü Links (SUB-Level)*/ 
27.
 
28.
a.menu:link, a.menu:visited { 
29.
 color:#340065; 
30.
 text-decoration:none; 
31.
 left:210px; 
32.
 
33.
34.
 
35.
a.menu:active, a.menu:hover { 
36.
 background-color: #eeeeee; 
37.
 color:#737994; 
38.
 left:210px; 
39.
 
40.
41.
 
42.
a.menu { 
43.
 
44.
 padding:1px 1px 1px 15px; 
45.
 
46.
 background-repeat:no-repeat; 
47.
 left:210px; 
48.
 z-index:1; 
49.
50.
 
51.
/*Aufklappbare Menüboxen, relative Positionierung, 
52.
 Sichtbarkeit: zuerst versteckt... */ 
53.
 
54.
 
55.
#navi tr div { 
56.
 visibility:hidden; 
57.
 width:400px; 
58.
 
59.
 background-color:#fff; 
60.
 border:1px solid #000; 
61.
 border-top-color:#000; 
62.
 z-index:5; 
63.
64.
 
65.
/* ...nur für gute Browser - Submenüs sichtbar machen per CSS: */ 
66.
#navi tr:hover div { 
67.
 visibility:visible; 
68.
  left:200px; 
69.
70.
<code> 
71.
html: 
72.
<code> 
73.
<table class="navigation" id="navi" cellpadding="0" cellspacing="0" border="0" summary="Navigationsleiste"> 
74.
 
75.
 
76.
 <tr > 
77.
 	<a class="navi" href="#" style="position:absolute; height:77px; top:100px; background-color:bdd2dc;">MENÜ 1</a> 
78.
	 <div> 
79.
	   <a class="menu" href="#">Hyperlink 1</a> 
80.
	   <a class="menu" href="#">Hyperlink 2</a> 
81.
	   <a class="menu" href="#">Hyperlink 3</a> 
82.
	   <a class="menu" href="#">Hyperlink 4</a> 
83.
	   <a class="menu" href="#">Hyperlink 5</a> 
84.
	</div> 
85.
 
86.
 </tr> 
87.
 
88.
 <tr> 
89.
 	<a class="navi" href="#" style="position:absolute;height:77px; top:180px; background-color:dcbdbd;">MENÜ 2</a> 
90.
	 <div> 
91.
	   <a class="menu" href="#">Hyperlink 1</a> 
92.
	   <a class="menu" href="#">Hyperlink 2</a> 
93.
	   <a class="menu" href="#">Hyperlink 3</a> 
94.
	   <a class="menu" href="#">Hyperlink 4</a> 
95.
	   <a class="menu" href="#">Hyperlink 5</a> 
96.
	</div> 
97.
 
98.
 </tr> 
99.
 
100.
 <tr> 
101.
        <a class="navi" href="#"  style="position:absolute;height:77px; top:260px; background-color:dcd9bd ;">MENÜ 3</a> 
102.
        <div> 
103.
	   <a class="menu" href="#">Hyperlink 1</a> 
104.
	   <a class="menu" href="#">Hyperlink 2</a> 
105.
	   <a class="menu" href="#">Hyperlink 3</a> 
106.
	   <a class="menu" href="#">Hyperlink 4</a> 
107.
	   <a class="menu" href="#">Hyperlink 5</a> 
108.
        </div> 
109.
 </tr> 
110.
 
111.
 
112.
 <tr> 
113.
        <a class="navi" href="#" style="position:absolute;   height:77px; top:340px; background-color:c4bddc ;">MENÜ 4</a> 
114.
	 <div> 
115.
	   <a class="menu" href="#">Hyperlink 1</a> 
116.
	   <a class="menu" href="#">Hyperlink 2</a> 
117.
	   <a class="menu" href="#">Hyperlink 3</a> 
118.
	   <a class="menu" href="#">Hyperlink 4</a> 
119.
	   <a class="menu" href="#">Hyperlink 5</a></div> 
120.
 </tr> 
121.
 
122.
 <tr> 
123.
        <a class="navi" href="#" style="position:absolute; height:77px; top:420px; background-color:bddcc4 ;">MENÜ 5</a> 
124.
	 <div> 
125.
	   <a class="menu" href="#">Hyperlink 1</a> 
126.
	   <a class="menu" href="#">Hyperlink 2</a> 
127.
	   <a class="menu" href="#">Hyperlink 3</a> 
128.
	   <a class="menu" href="#">Hyperlink 4</a> 
129.
	   <a class="menu" href="#">Hyperlink 5</a></div> 
130.
 </tr> 
131.
 
132.
 
133.
 
134.
 </table>
gruß saibonaut
Mitglied: Dani
21.09.2007 um 15:53 Uhr
Hallo saibonaut,
2 Bitten an dich:
  1. Bitte oben den Quellcode so anpassen, dass er einfach per copy & paste übernommen werden kann
  2. Also im meinem IE 7.0 wird gar nichts angezeigt und im FF sieht es ganz komisch aus.


Grüße
Dani
Bitte warten ..
Ähnliche Inhalte
Multimedia & Zubehör
Digicam Menü display geht Vorschau nicgt (3)

Frage von tsunami zum Thema Multimedia & Zubehör ...

Batch & Shell
gelöst Windows 10 1607 Firewall Context Menü (4)

Frage von Bugger zum Thema Batch & Shell ...

Batch & Shell
gelöst Powershell: Suchen und dynamisch erweitern (2)

Frage von rkrausby zum Thema Batch & Shell ...

Microsoft Office
Word 2010 - Drop-Down-Menü der Schnellbausteine stürzt immer ab

Frage von freeskierchris zum Thema Microsoft Office ...

Neue Wissensbeiträge
Batch & Shell

Batch als Dienst bei Systemstart ohne Anmeldung ausführen

(4)

Tipp von tralveller zum Thema Batch & Shell ...

Sicherheits-Tools

Sicherheitstest von Passwörtern für ganze DB-Tabellen

(1)

Tipp von gdconsult zum Thema Sicherheits-Tools ...

Peripheriegeräte

Was beachten bei der Wahl einer USV Anlage im Serverschrank

(9)

Tipp von zetboxit zum Thema Peripheriegeräte ...

Heiß diskutierte Inhalte
Windows 7
gelöst Lokales Adminprofil defekt (25)

Frage von Yannosch zum Thema Windows 7 ...

Server
gelöst Wie erkennen, dass nur deutsche IPs Zugang zu einer Website haben? (22)

Frage von Coreknabe zum Thema Server ...

LAN, WAN, Wireless
gelöst Statische Routen mit ISC-DHCP Server für Android Devices (22)

Frage von terminator zum Thema LAN, WAN, Wireless ...

Exchange Server
gelöst Migration Exchange 2007 zu 2013 - Public Folder teilweise weg (16)

Frage von Andy1987 zum Thema Exchange Server ...