Ein "funktionierendes" Dropdown-Menü?!

Ein CMSimple Support Forum für deutsch sprechende Nutzer und Entwickler
lck
Posts: 2963
Joined: Wed Mar 23, 2011 11:43 am
Contact:

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by lck » Tue Jun 02, 2015 9:33 pm

Hallo Holger,
Holger wrote:Was hälst Du eigentlich von der Idee mit dem zusätzlichen Link und dem Verzicht auf touch-menu.js?
Davon halte ich sehr viel! Ich bin kein Freund von JavaScript, JQuery und dergleichen. Mit css ist vieles machbar und in gewissen Bereichen hat css bereits die gleichen Möglichkeiten wie mit JavaScript.

Ich habe mich in letzter Zeit auch sehr viel mit mobiler, responsiver Navigation befasst, natürlich umgesetzt mit purem css. Aber bisher konnte ich keines finden, das mit/in CMSimple_XH gut umsetzbar ist und auf allen Browsern funktioniert. Ehrlich gesagt, bin ich der Meinung, lieber ein einfaches mobiles, reines Text-Menü, als ein nicht funktionierendes SlideIn, FadeIn, Dropdown oder sonstiges Menü. Nichts ist nervender als auf dem Smartphone auf den Menü-Button zu tippen und es passiert nichts. Momentan tendiere ich zu einem Select-Menü, aber das ist ohne Javascript anscheinend auch nicht umsetzbar :cry:

Aber wie ich, als php-Laie sehe, scheint ja mit MyLI (XH_Li) einiges machbar zu sein. Die meisten mobilen Menüs erfordern eine Veränderung der Struktur/Aufbau des automatisch, generierten Menüs von CMSimple_XH und wenn das möglich wäre, das wär ja schon was.
Holger wrote:... und die Eltern-Links das Dropdown nicht öffnen, sondern sofort die Seite laden?
Es gibt ja diesen sogenannten "checkbox hack", der für mobile Menüs gerne genutzt wird. Eventuell kann man sowas injizieren? Hier mal ein Beispiel.
„Bevor du den Pfeil der Wahrheit abschießt, tauche die Spitze in Honig!“   👉 Ludwig's XH-Templates for MultiPage & OnePage

cmb
Posts: 14225
Joined: Tue Jun 21, 2011 11:04 am
Location: Bingen, RLP, DE
Contact:

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by cmb » Tue Jun 02, 2015 11:26 pm

Ludwig wrote:Momentan tendiere ich zu einem Select-Menü, aber das ist ohne Javascript anscheinend auch nicht umsetzbar
Was meinst Du mit "Select-Menü"? Einfach ein <select> Element? Die hierarchische Struktur von CMSimple-Seiten ließe sich damit aber nur durch Einrückung simulieren, und optisch gibt das insgesamt nicht viel her. Und damit das ohne JavaScript überhaupt funktioniert, bräuchte man noch einen Schalter "Go to selected page".
Ludwig wrote:Es gibt ja diesen sogenannten "checkbox hack", der für mobile Menüs gerne genutzt wird. Eventuell kann man sowas injizieren? Hier mal ein Beispiel.
Interessant! Ohne CSS-Support sieht es etwas seltsam aus – könnte evtl. also Accessibility-Probleme geben. Trotzdem etwas, was man sich mal näher anschauen sollte. Ich kann derzeit Touchgeräte nur emulieren, aber da macht das Menü einen wirklich sehr guten Eindruck.

Eine solche Struktur kann auf jeden Fall mit CMSimple erzeugt werden – allerdings machen es das klassische li() wie auch das derzeitige XH_Li nicht gerade leicht, weil beide nicht rekursiv, sondern sequentiell arbeiten. Da sollte dringend nachgebessert werden...
Christoph M. Becker – Plugins for CMSimple_XH

lck
Posts: 2963
Joined: Wed Mar 23, 2011 11:43 am
Contact:

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by lck » Wed Jun 03, 2015 3:05 pm

cmb wrote:Was meinst Du mit "Select-Menü"? Einfach ein <select> Element?
Damit meinte ich einfaches Select-Menü für Smartphones mit kleinen Bildschimauflösungen - Beispiel.

Das hier könnte auch interessant sein.
„Bevor du den Pfeil der Wahrheit abschießt, tauche die Spitze in Honig!“   👉 Ludwig's XH-Templates for MultiPage & OnePage

cmb
Posts: 14225
Joined: Tue Jun 21, 2011 11:04 am
Location: Bingen, RLP, DE
Contact:

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by cmb » Wed Jun 03, 2015 3:11 pm

Ludwig wrote:
cmb wrote:Was meinst Du mit "Select-Menü"? Einfach ein <select> Element?
Damit meinte ich einfaches Select-Menü für Smartphones mit kleinen Bildschimauflösungen - Beispiel.
Ja, so in etwa dachte ich mir das auch. Es hat aber halt die genannten Nachteile.
Ludwig wrote:Das hier könnte auch interessant sein.
Das ist doch das im Prinzip das gleiche wie bei Holgers "Hamburger"-Buttons, oder?
Christoph M. Becker – Plugins for CMSimple_XH

Holger
Site Admin
Posts: 3470
Joined: Mon May 19, 2008 7:10 pm
Location: Hessen, Germany

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by Holger » Wed Jun 03, 2015 8:44 pm

Hallo zusammen,
Ludwig wrote:Es gibt ja diesen sogenannten "checkbox hack", der für mobile Menüs gerne genutzt wird. Eventuell kann man sowas injizieren? Hier mal ein Beispiel.
cmb wrote:Eine solche Struktur kann auf jeden Fall mit CMSimple erzeugt werden – allerdings machen es das klassische li() wie auch das derzeitige XH_Li nicht gerade leicht, weil beide nicht rekursiv, sondern sequentiell arbeiten. Da sollte dringend nachgebessert werden...
Doch, ist eigentlich ganz leicht: http://holgerirmler.de/ddm/?Some-Templa ... heckBoxNav :) .
Der Browser-Support für den :checked Pseudo Selektor ist ja eigentlich ganz ok. Nur wie so etwas in einem Screenreader abschneidet?
Aber nach wie vor bleibt auch da das Problem: Elternseite verlinken oder nicht? Wie Sitemap und Suchfunktion deaktivieren, wenn nicht verlinkt?

Man könnte die Seiten ja auch nachträglich aus der Sitemap löscen, aber z.B. XH_Controller::handlesitemap(); schreibt direkt an $o (warum eigentlich?, das könnte man doch leicht ändern), anstatt das Ergebnis per return auszugeben. Dann ginge dort nur, wenn überhaupt, Output Buffering...
cmb wrote:
Ludwig wrote:
cmb wrote:Was meinst Du mit "Select-Menü"? Einfach ein <select> Element?
Damit meinte ich einfaches Select-Menü für Smartphones mit kleinen Bildschimauflösungen - Beispiel.
Ja, so in etwa dachte ich mir das auch. Es hat aber halt die genannten Nachteile.
Ludwig wrote:Das hier könnte auch interessant sein.
Das ist doch das im Prinzip das gleiche wie bei Holgers "Hamburger"-Buttons, oder?
So ein simples Select-Menü lässt sich auf einem Smartphone aber gut bedienen?
Wo ist da denn das Problem, wenn man ein paar Buchstaben JS dafür braucht, um auf die gewählte Seite zu springen.
Ich wüsste nicht einmal, wie ich JS auf dem Smartphone abschalten könnte. Und in Firefox schafft das der Normal-User auch nicht mehr.
cmb wrote: Das ist doch das im Prinzip das gleiche wie bei Holgers "Hamburger"-Buttons, oder?
Stimmt.

Holger
Site Admin
Posts: 3470
Joined: Mon May 19, 2008 7:10 pm
Location: Hessen, Germany

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by Holger » Wed Jun 03, 2015 9:28 pm

Ups, in der Checkbox-Demo war der Link zur template.htm falsch. Hab's jetzt berichtigt.

cmb
Posts: 14225
Joined: Tue Jun 21, 2011 11:04 am
Location: Bingen, RLP, DE
Contact:

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by cmb » Wed Jun 03, 2015 9:58 pm

Holger wrote:Doch, ist eigentlich ganz leicht: http://holgerirmler.de/ddm/?Some-Templa ... heckBoxNav :)
Umso erfreulicher! :)
Holger wrote:Man könnte die Seiten ja auch nachträglich aus der Sitemap löscen, [...]
Oder die Sitemap auch ganz normal ausgeben. Könnte in XH_Li ja konditional gemacht werden.
Holger wrote:XH_Controller::handlesitemap(); schreibt direkt an $o (warum eigentlich?, das könnte man doch leicht ändern), anstatt das Ergebnis per return auszugeben. Dann ginge dort nur, wenn überhaupt, Output Buffering...
Den Code hatte ich quasi unverändert aus cms.php übernommen. Das kann gerne geändert werden. Am Controller ist sowieso noch viel zu tun.
Holger wrote:So ein simples Select-Menü lässt sich auf einem Smartphone aber gut bedienen?
Wo ist da denn das Problem, wenn man ein paar Buchstaben JS dafür braucht, um auf die gewählte Seite zu springen.
Ich wüsste nicht einmal, wie ich JS auf dem Smartphone abschalten könnte. Und in Firefox schafft das der Normal-User auch nicht mehr.
Ein wirkliches Problem ist das JS nicht. Ich selbst würde es aber auf jeden Fall als progressive Enhancement bringen, also einen Submit-Button ergänzen, und diesen dann per JS ausblenden/entfernen. So habe ich das z.B. auch beim Themeswitcher_XH gelöst.

Ich bin da halt eher etwas konservativ, und versuche JS als Voraussetzung zu vermeiden. Man weiß nie, wer eine Site besucht und inwiefern der Client JS versteht: Bots, Textbrowser, Screenreader, "normale" Browser, bei denen JS evtl. per Addon deaktiviert ist, und natürlich auch Uralt-Browser, die vielleicht vorher schon bei einem JS-Fehler ausgestiegen sind.
Christoph M. Becker – Plugins for CMSimple_XH

Holger
Site Admin
Posts: 3470
Joined: Mon May 19, 2008 7:10 pm
Location: Hessen, Germany

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by Holger » Wed Jun 03, 2015 10:16 pm

cmb wrote:Oder die Sitemap auch ganz normal ausgeben. Könnte in XH_Li ja konditional gemacht werden.
Stimmt. Da hätte ich selber drauf kommen können :roll: .
Sehe ich es richtig, dass man dann lediglich auf st == 'sitemaplevel' prüfen müsste? Dann kann man einfach die Überschrift der Seite ohne Link in die Sitemap schreiben...
Oder wie genau muss ich das machen?

Dann wäre die Suche aber trotzdem noch ein Problem, weil sie ja einen Link zur Seite erzeugen könnte... Oder übersehe ich da etwas?
cmb wrote:Oder die Sitemap auch ganz normal ausgeben. Könnte in XH_Li ja konditional gemacht werden.
Holger wrote: XH_Controller::handlesitemap(); schreibt direkt an $o (warum eigentlich?, das könnte man doch leicht ändern), anstatt das Ergebnis per return auszugeben. Dann ginge dort nur, wenn überhaupt, Output Buffering...
Den Code hatte ich quasi unverändert aus cms.php übernommen. Das kann gerne geändert werden. Am Controller ist sowieso noch viel zu tun.
Das wäre gut. Dann könnte man immer über $f oder $function eingreifen und die Ausgabe abfangen. Das sollte IMO überall so sein. Zuweisung an $o erst ganz zum Schluß in der cms.php -- wenn möglich.
cmb wrote:Ich bin da halt eher etwas konservativ, und versuche JS als Voraussetzung zu vermeiden.
Ist ja auch richtig. Und auch ich habe in FF NoScript aktiviert. Aber für Bots sollte eh über die Sitemap alles erreichbar sein und es muss natürlich gewährleistet sein, dass die Seite mit Einschränkungen trotzdem komplett navigierbar bleibt.

cmb
Posts: 14225
Joined: Tue Jun 21, 2011 11:04 am
Location: Bingen, RLP, DE
Contact:

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by cmb » Wed Jun 03, 2015 11:40 pm

Holger wrote:Sehe ich es richtig, dass man dann lediglich auf st == 'sitemaplevel' prüfen müsste? Dann kann man einfach die Überschrift der Seite ohne Link in die Sitemap schreiben...
Ja, so sollte das funktionieren.

Beim Überfliegen des Codes ist mir übrigens aufgefallen, dass XH_Li noch immer 'search' als Argument für $st auswertet. Das ist allerdings seit XH 1.5 hinfällig, weil die Suche seither die Suchergebnisliste gar nicht mehr per li() anzeigt. Das 'search' könnte in XH_Li also entfallen, oder wird das evtl. von Plugins (AdvancedSearch) genutzt?
Holger wrote:Dann wäre die Suche aber trotzdem noch ein Problem, weil sie ja einen Link zur Seite erzeugen könnte... Oder übersehe ich da etwas?
Ein Suchtreffer ist bei einer leeren Seite nur durch die Überschrift möglich. Diese könnte man zur Not manuell per page_params aber auch noch leeren – aber dann wird die Seite trotzdem gefunden! :o Eigentlich nicht korrekt, würde ich meinen. Wenn wir dieses Problem allgemein lösen, dann wäre das wohl ein gangbarer Weg; ggf. könnten solche Oberseiten auch automatisiert die Page-Data ändern lassen. Ansonsten müsste wohl die Suchfunktion individuell angepasst werden.
Holger wrote:Das wäre gut. Dann könnte man immer über $f oder $function eingreifen und die Ausgabe abfangen. Das sollte IMO überall so sein. Zuweisung an $o erst ganz zum Schluß in der cms.php -- wenn möglich.
Eigentlich eine gute Idee. Ich bin aber auch nicht sicher, ob es möglich ist. Traditionell wurden in cms.php (und adm.php) die diversen $f und $function an sehr unterschiedlichen Stellen verarbeitet. Ich weiß nicht, ob das ganz bewusst so gemacht wurde, oder ob es im Lauf der Zeit so gewachsen ist. Beim Refactoring für XH 1.6 und auch später (v.a. XH_Controller) habe ich diese Abfolge daher beibehalten. Es wäre auf jeden Fall wünschenswert, das alles mal zu vereinheitlichen, was den Überblick doch deutlich erleichtern dürfte.
Christoph M. Becker – Plugins for CMSimple_XH

Lemon
Posts: 167
Joined: Mon Dec 08, 2008 4:24 pm

Re: Ein "funktionierendes" Dropdown-Menü?!

Post by Lemon » Mon Jun 22, 2015 3:39 pm

Hallo,

ich hätte uach mal eine frage zum Dropdownmenü.
Wie kann ich die 3. Ebene nach links anstelle von recht bekommen?
Beim ausklappen mit hover geht das Menü nach links, ick hätte es aber gerne nach rechts.

Vielen Dank.

Post Reply