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

Hover - Absolute Positionierung

Frage Entwicklung CSS

Mitglied: ottscho

ottscho (Level 2) - Jetzt verbinden

06.06.2012, aktualisiert 11:49 Uhr, 3151 Aufrufe, 4 Kommentare

Hallo,

ich habe ein Problem und weiß nicht genau ob es lösbar ist.
Ich habe eine 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.
Hier ein kleines Code-Beispiel:
01.
<li> 
02.
<a href="#">Hauptpunkt</a> 
03.
<ul> 
04.
<li>unterpunkt</li> 
05.
<li>unterpunkt2</li> 
06.
</ul> 
07.
</li>
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.


Jetzt will ich aber einen Tooltipp für die Unterpunkte verwenden. Dies geht über jquery und bindet sobald ich mit der Maus über einem Unterpunkt bin ein zusätzliches DIV unter die LI ein. Beispiel:
01.
<li> 
02.
<a href="#">Hauptpunkt</a> 
03.
<ul> 
04.
<li>unterpunkt</li> 
05.
<div>Ich erscheine per MouseOver des ersten Unterpunktes</div> 
06.
<li>unterpunkt2</li> 
07.
</ul> 
08.
</li>
Soweit klappt das auch. Aber bewege ich mich jetzt mit der Maus schnell nach unten, so bin ich kurze Zeit per MouseOver über dem DIV. Das DIV ist absolut positioniert. Mein UL Menü klappt ein. Und genau das will ich vermeiden. Aber ohne absolute Positionierung geht der Tooltipp nicht. Kann ich dem DIV irgendein CSS Attribut mitgeben welches mein Problem löst?

Ich hoffe ihr habt meine Problematik verstanden.

Danke

Mitglied: Arano
06.06.2012 um 17:34 Uhr
Hallo Ottscho,

ich glaube das kannst du nur unterbinden wenn das DIV als Kindelement des LIs definiert wird, so das wenn du mit dem Cursor über dem DIV bist, du auch immer noch über dem "Haupt-LI" und dem "Sub-LI" bist. Das geht aber nicht mit der absoluten Positionierung.

Alternativ das DIV weiter zur Seite verschieben so das man es nicht überfahren kann und die LIs nicht verlässt, so wird auch der zweite Link wieder sichtbar der ja von dem absolut positioniertem DIV verdeckt sein müsste !?


~Arano
Bitte warten ..
Mitglied: ottscho
09.06.2012 um 09:21 Uhr
Danke für deine Info.

Ohne absolute Positionierung wird es nicht einfach werden. Mal schauen ob da geht.


Daknke

ottscho
Bitte warten ..
Mitglied: Oli-nux
30.09.2012 um 12:34 Uhr
Such mal bei Google nach:
css tooltip hover

Die ersten paar Links sollten schon hilfreich sein.
Bitte warten ..
Mitglied: Arano
30.09.2012 um 18:56 Uhr
Sorry, aber kein schöner Kommentar

1. Wird er es schon geschafft haben, da er sich seit 3 Monaten nicht gemeldet hat
2. Ist es absolut zum KOTZEN, wenn man VON Der Suche hier ins Forum kommt, zu einem Problem das hier den gleichen Titel trägt wie die eigenen Suchwörter, dann aber doch nur wieder zurück zur Suche geschickt wird *würg* weil die "Helfer" nicht mehr als "let me google that for you" drauf haben...

Entweder KANN und WILL man helfen, oder eben NICHT !

Wenn sich keiner meldet, wird der Fragende schon selber auf die Idee kommen zu suchen... und wenn nicht, dann ist es wohl auch besser so.


Die "ersten paar Links" (5) habe ich mir mal __fix__ angesehen...
So fix sagen die auch nur, dass das "Tooltip-Element" ein Kindelement des "Hover-Elements" sein sollte... aber genau DAS habe ich ja schon vor 3 Monaten geschrieben. Gut, mit der absoluten Positionierung habe ich mich wohl geirrt

Was aber fehlt ist die Kombination mit dem CSS-Menü, die hier ja zur Problembeschreibung gehört !
Davon mal abgesehen HAT der Fragesteller bereits einen Funktionierenden Tooltip


~Arano
Bitte warten ..
Neuester Wissensbeitrag
Windows 10

Powershell 5 BSOD

(8)

Tipp von agowa338 zum Thema Windows 10 ...

Ähnliche Inhalte
CSS
gelöst Probleme mit der Positionierung von DIV (8)

Frage von 127944 zum Thema CSS ...

Heiß diskutierte Inhalte
Microsoft
Ordner mit LW-Buchstaben versehen und benennen (20)

Frage von Xaero1982 zum Thema Microsoft ...

Outlook & Mail
gelöst Outlook 2010 findet ost datei nicht (19)

Frage von Floh21 zum Thema Outlook & Mail ...

Netzwerkmanagement
gelöst Anregungen, kleiner Betrieb, IT-Umgebung (18)

Frage von Unwichtig zum Thema Netzwerkmanagement ...