Menülistenscroll bei zu großer Länge

[glupto]

Hallo, ich habe ein multilevelpushmenü als modul eingebunden in meine Seite. Auf manchen Menüpunkten läuft die Liste allerdings über, so dass die unteren Elemente nicht mehr zu sehen sind (z.B. alle Länder von Südamerika werden aufgelistet, aber nicht alle passen auf die Liste - zumindest auf dem smartphone und kleineren Monitoren). Ich habe ins css ein "overflow: auto" eingefügt, da ich in einem solchen Fall eine Scrolleiste brauche (bei overflow:scroll kriege ich ja immer eine Scrolleiste). Das klappt aber nicht. Könnte sich jemand das mal ansehen und sagen, wo es hakt oder ob das von vornherein der falsche Weg ist. Also am besten gleich auf den Unterpunkt "Südamerika" gehen.

My Webpage

Gruß und Dank glupto

 

[Alain Aubert]

Hi Glupto

In Google Chrome funktioniert es wie intendiert - nehme ich an. Scroll Leiste wird
Allerdings sieht die Scroll Leiste gar nicht gut aus. Sogar sehr schlecht.

Das Design find ich cool, sehr stimmig, UI reagiert wie erwartet, deshalb finde ich den Lösungsansatz tatsächlich suboptimal, er zerreisst das Bild.

Ich würde eine schöne Schaltfläche erwarten die einen Pfeil nach unten als Picto enthält. Auf konventionellen Geräten onmouseover oder touch steuert den Scroll Vorgang des Scrollens. Finde das ist dem Design geschuldet.

lg

 

[Toro]

Hallo Glupto,
Also wenn Du den vertikalen Scrollbar (hoch-runter) weg haben willst: overflow: hidden; Würde ich aber lieber nicht machen, denn die Leute mit kleiner screen wissen dann ja nicht das da noch viel mehr ist als was sie sehen.
Das ganze responsiv design ist aber irgendwie nicht ganz abgestimmt. Z.B. ist in Firefox unten immer ein horizontaler scrollbar, sogar bei 1500 Pixel breite noch. Zeigt auch dasselbe in Webdevelopertools bei “view responsive Layouts”. Das würde mich viel mehr stören. In Chrome scheint der horizontale scrollbar zu verschwinden wenn das Menü zu, egal welche Breite.
Dann, obwohl Du ältere Internet-Explorer einige male mit <!--[if lte IE 9]> auf andere stysheets verweist, sieht es da in älteren IE's nicht gut aus. OK, verstehe damit geht man sicher auch nicht auf die Seite www. ..../collapsed.php, aber trotzdem. Und " You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>” ... thanks, I know

Was ich auch bemerkt habe ist wenn das Menü offen ist, nimmt es für jeden weiteren sublevel nochmal 40 Pixel ein durch das extra icon das dann rechts erscheint (Einkaufswagen, Label) welches Du an Platz sparen könntest, bzw. die der user mit kleiner screen weniger links rechts scrolllen müsste.
Solltest unbedingt mal HTML und CSS testen und validieren – im Moment sind im HTM 272 Fehler und im CSS 87 Fehler. Das beinflusst auch die Ladezeit.

 

[glupto]

Danke erstmal, bei der scrolleiste (egal, wie ich das dann vom design her löse), habe ich auch noch das Problem, dass es nicht auf dem smartphone funktioniert, ob ich da ein entsprechendes mediaquery eingegeben habe (aber eigentlich sollte height: 100% und overflow:auto ja, wenn es funktioniert, überall funktionieren?).
HTML und CSS gehe ich noch durch, manche Fehler kommen auch durch die fehlerhaften feeds, die ich einlese.
Das multilevelpushmenu gefällt mir auch noch nicht so 100%ig, weil es dann doch auf meinem smartphone sehr langsam reagiert und auch nur wenn ich den menu-icon öfter drücke, was ja nicht sein sollte.

Aber ich habe noch ein ganz anderes Problem (Vielleicht weiß hier jemand eine Antwort, die ich sonst im Netz nicht gefunden habe): Um meine Seite schneller zu machen wollte ich die pagespeed-add-on-Empfehlungen umsetzen und habe in meine .htaccess-Datei entsprechendes reingeschrieben.

CODE AuthName "Benutzername und Passwort"
AuthType Basic
AuthUserFile /customers/6/d/c/xyz.de/httpd.www/.htpasswd
AuthName "Name of Page"
AuthType Basic
<Files "presseschau.php">
require valid-user
</Files>
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/ico "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 7 days"
ExpiresByType application/x-javascript "access plus 7 days"
ExpiresByType application/javascript "access plus 7 days"
</IfModule>


also, es geht um mod_expires. Aber ich weiß nicht, ob dieses If...jetzt nur für die Unterseite "presseschau.php" gilt, weil ich ja dafür oben den Zugriff geregelt habe. Und wenn ja, wie ich diese Ablaufzeiten für alle Unterseiten festlegen kann. Denn es wird immer noch von pagespeed gemeckert, dass für css und js-Dateien kein Ablauf festgelegt wurde, merkwürdigerweise wird das aber für die Bildformate nicht angemeckert....

Dank für Hilfe und Gruß
glupto