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

CSS Menu (fliegendes Menü) Problem

Frage Entwicklung CSS

Mitglied: HZ-pro

HZ-pro (Level 1) - Jetzt verbinden

21.08.2012, aktualisiert 09:36 Uhr, 3892 Aufrufe, 6 Kommentare

Hallo, habe folgendes Problem:

ich bin gerade dabei eine neue Webseite zu erstellen, soweit funktioniert alles bis auf die Menüleiste.
Die DropDown Menü welches automatisch aufklappt, wenn ich per Mouseover in einem Bereich bin. Ist also ein reines CSS Menü.
In diesem aufklappt Menü befinden sich unter Punkte.

Bin ich nun mit der Maus über dem Link "Hauptpunkt", so klappt die UL darunter auf und ich kann innerhalb der UL navigieren. Verlasse ich den Bereich, so klappt das Menü wieder ein. Soweit passt auch alles.

ABER, wenn ich per Mouseover über die Hauptpunkt und dann über die UL gehe und den Mausrad bewege(Scroll up/Down) so habe ich ein fliegendes UL Menü s. Bild.

Weisst jemand vielleicht woran das liegen könnte?

Danke

HZ-Pro

7734e1b24a38d50034ebc4c9b28e71ce - Klicke auf das Bild, um es zu vergrößern


Mitglied: nxclass
21.08.2012, aktualisiert um 10:58 Uhr
... gibts es da evtl mal ein Code Schnipsel ?
Welchen Browser (-Version) benutzt Du ? - hast Du andere versucht ?
Bitte warten ..
Mitglied: bytecounter
21.08.2012 um 11:49 Uhr
Ja, vielleicht ein Tippfehler?

Mehr kann man Dir vielleicht sagen, wenn wir mal Einblick in den Code bekommen und Du uns auch noch verrätst, mit welchen Browsern Du das Ganze getestet hast und bei welchem (oder allen) der Fehler auftritt.

vg
Bytecounter
Bitte warten ..
Mitglied: HZ-pro
21.08.2012, aktualisiert um 14:22 Uhr
gleicher Verhalten mit allen Browsern

Code:

#dmenu { margin: 0px;
padding: 0px;
list-style-type: none;
position: static;
background-color: rgb(245, 215, 245);
color: rgb(46, 46, 144);
z-index: 20;
cursor: pointer;
overflow: hidden;
background-image: url(./bild/r.png);
}

#dmenu li.menu { border-left: 1px solid rgb(255, 133, 244);
padding: 8px 0px 0px ! important;
list-style-type: none;
float: left;
position: relative;
display: block;
background-image: url(./bild/x.png);
text-align: center;
}

#dmenu li.menu:hover { background-image: url(./bild/y.png);
}

#dmenu .menu a.menu { padding-bottom: 5px ! important;
text-decoration: none;
width: 144px;
color: rgb(244, 5, 98);
font-size: 14px;
font-weight: bold;
}

#dmenu .menu a.menu:hover { color: rgb(255, 255, 255);
}

#dmenu ul { margin: 0pt;
position: absolute;
list-style-type: none;
display: none;
background-color: rgb(211, 211, 211);
color: rgb(215, 215, 215);
z-index: 99;
width: 144px ! important;
}

#dmenu ul li { border-top: 1px solid white;
border-bottom: 1px solid rgb(217, 218, 218);
margin: 0pt;
padding: 1px 1px 1px 20px;
color: rgb(215, 215, 215);
position: relative;
display: block;
}

#dmenu li a { display: block;
color: rgb(0, 0, 0);
font-weight: inherit;
width: auto;
}

#dmenu ul a { padding: 4px;
display: block;
text-decoration: none;
text-align: left;
text-transform: none;
font-weight: normal;
width: 122px;
color: rgb(81, 81, 81);
}

#dmenu a:hover, #dmenu li:hover { color: rgb(0, 0, 0);
position: relative;
display: block;
}

#dmenu ul li a:hover { opacity: 1;
background-color: rgb(182, 182, 182);
color: rgb(61, 61, 61);
}

#dmenu ul li:hover { border: 1px solid rgb(182, 182, 182);
margin: 0pt;
padding: 1px 0pt 1px 19px;
position: relative;
display: block;
opacity: 1;
background-color: rgb(182, 182, 182);
}

#dmenu li:hover ul ul, #dmenu li:hover ul ul ul, #dmenu li:hover ul ul ul ul, #dmenu li:hover ul ul ul ul ul { display: none;
position: relative;
}

#dmenu li:hover ul, #dmenu ul li:hover ul, #dmenu ul ul li:hover ul, #dmenu ul ul ul li:hover ul, #dmenu ul ul ul ul li:hover ul { display: block;
position: fixed;
}

li > ul { top: auto;
left: auto;
}

.content { clear: left;
}
Bitte warten ..
Mitglied: nxclass
21.08.2012, aktualisiert um 20:18 Uhr
... gibts es da evtl mal ein Code Schnipsel ?
darf es etwas mehr sein ? - bitte verstehe mich nicht falsch, aber wenn Du doch wenigstens mal nur das Menü selbst in einer einzelnen Datei packen und den Code posten könntest, wäre das toll und man müsste es nicht selbst erfinden.
btw. meistens erkennt man dann auch schon selbst den Fehler.

01.
    <div> 
02.
        <ul id="dmenu" class="menu"> 
03.
            <li class="menu"> 
04.
                <a class="menu">1</a> 
05.
                <ul> 
06.
                    <li> 
07.
                        <a>1-1</a> 
08.
                        <ul> 
09.
                            <li><a>1-1-1</a></li> 
10.
                            <li><a>1-1-2</a></li> 
11.
                        </ul> 
12.
                    </li> 
13.
                    <li><a>1-2</a></li> 
14.
                    <li><a>1-3</a></li> 
15.
                </ul> 
16.
            </li> 
17.
        </ul> 
18.
    </div>
... das funktioniert - und ich kann den von Dir beschriebenen Effekt nicht nachvollziehen ... allerdings habe ich auch nirgends dieses .content drin.
Bitte warten ..
Mitglied: HZ-pro
30.08.2012 um 14:55 Uhr
das hier klärt was ich meine:
http://de.selfhtml.org/css/eigenschaften/anzeige/position.htm

mein Menu

#dmenu li:hover ul, #dmenu ul li:hover ul, #dmenu ul ul li:hover ul, #dmenu ul ul ul li:hover ul, #dmenu ul ul ul ul li:hover ul { display: block;
position: fixed; >>(geändert in static)<<
}
ich habe die Position in static geändert an Stelle von fixed und so blieb das
dmenu li fest beim Scrollen, aber dafür verschiebt sich nun der Text unter dem Menü
ich muss weiter nach einer Lösung suchen...

Danke
HZpro
Bitte warten ..
Mitglied: d4shoerncheN
30.08.2012 um 14:59 Uhr
Hallo,

poste doch bitte mal den Link zu deiner Seite. Gerne auch nur einen Extralink für deine Navigation.

So lassen sich Fehler etc. viel schneller finden.

Gruß
Bitte warten ..
Neuester Wissensbeitrag
Ähnliche Inhalte
Windows 10
Problem: einzige Konto gesperrt + Bitlocker aktiv (11)

Frage von Windows11 zum Thema Windows 10 ...

Exchange Server
Problem mit POP3-Abruf eines Exchange-2013-Postfachs

Frage von YotYot zum Thema Exchange Server ...

Multimedia & Zubehör
gelöst BENQ Beamer Fernbedingung Frequenz Problem (4)

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

Heiß diskutierte Inhalte
Windows Userverwaltung
Ausgeschiedene Mitarbeiter im Unternehmen - was tun mit den AD Konten? (33)

Frage von patz223 zum Thema Windows Userverwaltung ...

LAN, WAN, Wireless
FritzBox, zwei Server, verschiedene Netze (21)

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

Viren und Trojaner
Aufgepasst: Neue Ransomware Goldeneye verbreitet sich rasant (20)

Link von Penny.Cilin zum Thema Viren und Trojaner ...

Windows Netzwerk
Windows 10 RDP geht nicht (18)

Frage von Fiasko zum Thema Windows Netzwerk ...