Fehler im Dropdown Menu in Responsive

  • Hallo zusammen,
    ich bin beim googeln auf diese Seite gekommen und hoffe vielleicht hier Hilfe zu meinem Problem zu bekommen.
    Für unseren Verein (wir sind eine Mainzer Fastnachtsgarde) möchte ich eine neue Homepage im Responsive Desingn machen und bin mit Hilfe schon weit gekommen.
    Hier mal der Link: http://garfield1711.bplaced.net/index.php
    Mein Problem ist lediglich noch das das Dropdown Menu im Smartphone und Tablet nicht richtig reagiert.
    Im Menüpunkt "Die Garde" habe ich mal 2 untermenüs mit der Bezeichnung Test 1 und Test 2 eingefügt.
    Am Desktop geht das richtig aber bei mobilen Geräten berühre ich "Die Garde"
    und in den 2 Menüs untendrunter kommt links eine Einblendung Test1 & Test 2 und geht dann wieder zu ohne das man etwas auswählen kann.
    Vielleicht ist es nur ein kleines CSS Problem aber ich komme einfach nicht weiter.
    Hat vielleicht jemand hier eine Lösung damit das richtig Funktioniert?
    Ich wäre Euch so dankbar da ich schon bald ein Jahr versuche den Fehler zu finden.

    Gruß
    Garfield

  • na auf tablets wird der hover gar nicht oder nur rudimentär umgesetzt. mitm finger hovern wird, öööhm, schwierig^^
    also samsung macht zwar was mit airview und gesten etc, aber das is ja eh alles käse.
    dein .topnav ul li:hover Ul is das problem. mach lieber nen javascript da rein, was dem menüpunkt ne klasse gibt oder mach die unterpunkte auch direkt sichtbar und eingerückt.

    alternativ kannste was scribbeln mit erster touch, zweiter touch, der erste macht dann den hover der zweite den klick
    machste nen counter und speicherste welches element "getouched" wurde (target). wenn der nächste touch kommt => auswerten: is das element gleich, klickaction, wenn net, counter auf 0 machen und das target tauschen.

  • Hallo Synaptic,

    entschuldige das ich mich jetzt erst melde (einige private Schicksale).
    Danke für Deine Antwort.
    Habe mal Probiert die .topnav ul li:hover Ul zu entfernen aber da passiert auch nichts.
    Wie kann ich den hover Effekt komplett rausnehmen und durch js ersetzen?
    Komme da eben nicht weiter bzw. finde keine Lösung.
    Deine Erklärung das hover auf Smartphones und Tabletts nicht geht war schon einleuchtend.
    Wäre Dir für Deine Hilfe sehr dankbar.

    Viele Grüße
    Garfield

  • Hallo,

    wenn du eine benutzerfreundliche Seite erstellen willst sollten grundsätzlich immer alle Menüeinträge sichtbar sein, egal bei welcher Fensterbreite. Deshalb solltest du synaptics Vorschlag

    Zitat

    mach die unterpunkte auch direkt sichtbar

    folgen.

    Gruss

    MrMurphy

  • Hallo

    Zitat

    wäre das dann nicht eine lange Reihe nach unten auf einem Smartphone bis der eigentliche Inhalt kommt?

    Ich denke

    Zitat

    möchte ich eine neue Homepage

    dass du die Homepage erstellen willst? Dann bestimmst du die Anzahl der Seiten und ihren Inhalt. Damit kann sich das Problem überhaupt nicht stellen.

    Außer du bist süchtig nach einem Aufklappmenü und kannst nicht davon lassen.

    Wenn du wirklich viele Seiten benötigen solltest erstelle besser mehrere kleine Menüs die dann nur auf den relevanten Seiten auftauchen, dann aber auch dauerhaft sichtbar sind.

    Gruss

    MrMurphy