Mobile-Menue statt ">" das ganze Wort als Menüaufruf benutzbar

Urlaub

Vom 13.5 - 2.6.2024 bin ich ("phil-web") im Urlaub.

Selbstverständlich können neue Themen erstellt, Probleme gemeldet oder Wünsche geäußert werden.
Während des Urlaubs werden allerdings nur dringende Probleme bearbeitet!

Vielen Dank für euer Verständnis!

1. offizieller Beitrag
    • Neu

    Hallo Phil,


    Achtung: Kein WZP Thema

    Hatte Heute ein Gespräch mit einem Tablet-Nutzer, der auf meiner Webseite (Flat Responsive) die Menüs (normales horiz. Menüband) nicht aufklappen konnte, da er auf das Wort geklickt hat und dadurch in den ersten Untermenüpunkt gelotst wurde ohne dass er den kompletten Menü-Inhalt zu sehen bekam. Das ist das leidige Thema auch beim Handy (Hamburger), dass es einen begrenzten Klick auf das ">"-Zeichen bedarf, um das Menü aufzuklappen.

    Weniger verwirrend wäre es natürlich, wenn die User nur das Wort anzuklicken bräuchten - und wenn sich ein Menü dahinter verbirgt, klappt das Menü dann auch aus. Das ">"-Zeichen ist einfach als Fingerlandefläche zu klein und zu UNSCHEINBAR.

    Ich vermute mal, dass es mit etwas CSS hier wohl nicht getan ist...



    Dachte ich frag mal Dich, da ich in der Vergangenheit schon zweimal im ZP Forum dbzgl. nichts erreicht habe.


    Sorry wegen des Themenfremden reingrätschens.


    Liebe Grüße Andreas

    • Neu

    Phil,

    das ist für mich und für die Benutzer zwar echt ein Hemmnis, aber wenn selbst ZP sich da zurück hält, muss das wohl echt ein Ding sein.

    Du kannst Dir da Zeit nehmen so viel Du brauchst. Absolut. Eine Lösung ist hier aber KEIN Muss. Wenns nicht geht, dann geht es eben nicht ;-D

    Bin ja mehr als Dankbar, dass Du dich überhaupt meinem Problem annimmst.


    Wir hören uns nächste Woche dann mal, wenn Du Lust hast. Genieße das Wochenende, es wird sonnig,


    Grüße Andreas

    • Neu

    Hallo Andreas,

    hat nichts mit dem hiesigen Thema, aber deiner Website zu tun und ist mir gerade aufgefallen: Wohl ein Tippfehler: "Cockie" statt "Cookie". ;)


    Bleibt gesund!


    Beste Grüße Jörg



    ---


    Ich nutze Zeta Producer 16.8.2 Business / Windows 10 (jeweils aktuellste Version).

    • Neu

    Hallo Andreas, hallo Phil,


    nur ein paar kleine Hinweise meinerseits, die vielleicht zu einer Lösungsfindung beitragen.


    Zunächst zur Desktopansicht. Hier hast Du, Andreas, ja die jeweiligen Hauptseiten wie „Infothek“, „Bildergalerie“ usw. auf Unterseiten weitergeleitet, weil Du die genannten Seiten gar nicht pflegen willst, und sie einfach nur als Überschriften fungieren sollen. Die Weiterleitung auf eine der Unterseiten verwirrt den Besucher natürlich.


    Die ganz einfache Abhilfe ist in diesem Fall die Weiterleitung der jeweiligen Hauptseite mit dem Weiterleitungsziel „#“. Nun kann „Infothek“ nicht mehr angeklickt werden und es erscheint nur noch das Ausklappmenü. Zugegeben, schwebt der Cursor über „Infothek“ verhält er sich wie über einem Link. Das dürfte aber kaum jemandem auffallen und ist ein minimaler optischer Mangel dieser Lösung, den ich auf meiner Seite sehr gerne in Kauf nehme.


    Im Folgenden beziehe ich mich aber auf „Top Responsive“.


    Leider wirkt sich die Umleitung auf „#“ auf das mobile Menü etwas anders aus als erwartet. Hier wird der Name leider nicht stillgelegt. Ein Klick auf den Namen befördert einen meist auf die Startseite (die Regularitäten habe ich bislang nicht weiter untersucht). Der Klick auf den Pfeil öffnet aber weiterhin wunschgemäß das Ausklappmenü.


    Im ZP-Forum bin ich dann auf folgenden CSS-Code gestoßen:


    <style>


    #navigation ul li.haschilds > a {


    pointer-events: none;


    cursor: pointer;


    }


    #navigation ul li.haschilds > a span {


    pointer-events: auto;


    }


    </style


    Dieser legt in der mobilen Ansicht den Namen still, sofern die entsprechende Seite Unterseiten hat, und nur der Pfeil ist noch funktionstüchtig. Das ist natürlich nicht das, was Du eigentlich suchst, aber ich bin mit dieser Lösung sehr zufrieden. Der Besucher landet jedenfalls nicht auf einer falschen Seite. Bei einem kurzen Test mit Deinem Layout hat der Code allerdings nicht funktionieren wollen. Das sollte aber keine große Hürde für Phil sein, das CSS für Dein Layout entsprechend anzupassen.


    Und ansonsten führt der Code vielleicht Phil in die richtige Richtung. Bei meinem Layout würde es mir natürlich auch sehr gut gefallen, wenn ein Klick auf den Namen im mobilen Menü das Ausklappmenü hervorzaubert.


    Viele Grüße


    Tom

    • Neu

    Hallo Tom,

    Danke für Dein Einbringen in dieses Thema!

    Das mit dem "#" wäre ne gangbare Lösung, wäre nicht wie von Dir auch beschrieben im Mobile-Menue die "Umleitung" auf die Startseite. Konnte ich so auch bei mir reproduzieren.

    Den Code habe ich bei mir im Flat-Responsive in merhreren Abwandlungen ausprobiert. Aber ohne einen erkennbaren Wert. Ist wohl auch ne Layout-Geschichte. War ein Versuch wert. Ich bin da eh leider leider nicht wirklich bewandert, was mich sehr nervt ;-D

    Vielleicht kommt Phil der Lösung durch Deinen Ansatz etwas näher, kommende Woche.

    Vielen Dank für Deine Hinweise Tom und ein schönes Wochenende.


    Grüße aus Schwaben,

    Andreas

    • Neu
    • Offizieller Beitrag

    Hallo,


    ich glaube, ich habe eine Lösung gefunden. Bitte den folgenden Javascript-Code unter "Website" > "Erweitert" > "Attribute" im Attribut "mobile_script" einfügen (ggf. muss die Option "Alle anzeigen" aktiviert werden). Der Code funktioniert nur im Layout "Flat Responsive", ich kann das aber natürlich auch entsprechend für andere Layouts anpassen / versuchen, einen universellen Code zu erstellen.


    • Neu

    Hei Phil,


    leider klappt das nicht bei mir. Sorry.

    Habe sicherheitshalber auch einmal meinen gesamten eigenen CSS raus genommen.

    Verschiedene Browser benutzt, cache gelöscht, ...

    • Neu

    B I N G O

    Was soll ich sagen - dieses Thema mit dem extrem benutzerverwirrenden Mobile-Menü-Handling ( ">" ) ist nun ENDLICH vom Tisch! Hiermit fällt mir der "größe" Stein vom Herzen, seit ich mit Zeta Producer unterwegs bin!! Ich steh echt in Deiner Schuld. Warum das bislang noch Keiner gefixt hat, ist mir ein Rätsel. War es doch echt schludrig und nicht zufriedenstellend gelöst bisher.

    Ach so - und ja: Es funktioniert ;-DD

    Phil, sag mir, was kann ich DIR Gutes tun?

    Bin gerade sowas von HAPPY.


    Liebe Grüße, Andreas


    PS: Mit der Pixel-Breite muss ich noch etwas spielen, damit auch Tablets-Nutzer in den Genuss kommen.

    • Neu
    • Offizieller Beitrag

    Super, das freut mich!

    Zitat von Andreas

    Warum das bislang noch Keiner gefixt hat, ist mir ein Rätsel. War es doch echt schludrig und nicht zufriedenstellend gelöst bisher.

    Seitens Zeta ist das normale Verhalten ja so gewünscht, da die meisten Nutzer eben auch die Hauptseite mit Inhalt befüllen und diese sonst nicht aufrufbar wären.


    Zitat von Andreas

    Phil, sag mir, was kann ich DIR Gutes tun?

    Du musst mir nichts dafür geben und ich will auch nichts dafür haben. Dieses Projekt ist und bleibt kostenlos - es ist ja auch nur ein Hobbyprojekt :)

    • Neu

    Hallo Andreas,


    super, dass sich da eine Lösung gefunden hat. Mich würde nun aber mal interessieren, wie es sich mit Phils Skript in der mobilen Ansicht verhält, nachdem Du auch den Aufruf der Hauptseiten mittels „#“ unterbunden hast, so dass in der Desktop-Ansicht bei einem Klick auf „Bildergalerie“ gar nichts passiert.


    Viele Grüße


    Tom