CMSimple_XH–Forum

lck wrote: ↑

Wed Jun 13, 2018 9:38 am

Tja, eine konkrete Lösung habe ich auch nicht gefunden, nur Lösungsansätze. Ob das in deinem Template umsetzbar ist, wäre noch zu testen.
Hier mal ein Ansatz mit position: fixed und hier per jQuery.

Tja. Beinahe! - Aber eben nicht wirklich.
Habe getestet.
Variante 1 (fixed):
Ich bekomme zwar das Hintergrundbild im Container fix, es bleibt allerdings auch wirklich stehen und wird vom html-Hintergrund nicht überdeckt. z-index-Manipulationen helfen nicht. Wahrscheinlich mache ich was falsch.
Variante 2 (jQuery):
Offensichtlich sind da so viele Berechnungen nötig, dass es immer Verzögerungen gibt. Beim Wischen (Scrollen) verhält sich das bunte Bild "elastisch". Es scrollt erst ein bisschen mit und wandert dann in die (nur beinahe) richtige Position zurück. Die anderen Animationen, die u.U. auch noch gleichzeitig ablaufen, verursachen ein "Ruckeln".

Fazit: Ich werde es lassen, wie es ist.

frase wrote: ↑

Thu Jun 14, 2018 4:33 am

Variante 2 (jQuery):
Offensichtlich sind da so viele Berechnungen nötig, dass es immer Verzögerungen gibt. Beim Wischen (Scrollen) verhält sich das bunte Bild "elastisch". Es scrollt erst ein bisschen mit und wandert dann in die (nur beinahe) richtige Position zurück. Die anderen Animationen, die u.U. auch noch gleichzeitig ablaufen, verursachen ein "Ruckeln".

Nicht wirklich überraschend. Wenn Browserhersteller bestimmte CSS-Features aus Performancegründen nicht unterstützen, wird ein Workaround per JS eher noch schlimmere Performance-Probleme verursachen.

cmb wrote: ↑

Thu Jun 14, 2018 12:57 pm

Nicht wirklich überraschend.

So isses.

Super Template, Frank!! Gefällt mir sehr gut.
Den Hamburger im Kopf- und die Navi im Fussbereicht finde ich ein sehr gelungener Ansatz. Was ich mir vielleicht noch wünsche, ist ein skiplink zur Navigation für die Barrierefreiheit.
Was mich etwas stutzig macht: jetzt bist Du praktisch auf der Zielgeraden für ein Template ohne JS und dann kommen am Ende noch die (wohl spannenden) Animationen rein, die aber keinen Fallback haben. Ginge das nicht auch mit CSS Animation?
Was an der :target Navigation etwas gewöhnungsbedürftig ist, ist das aufgeklappte Menü bei Seite zurück/history.back. Da würde ich - wenn schon JS - das schon von Christoph bemerkte Menü auf toggle modifizieren und den CSS fallback beibehalten.

Was hast Du da denn für einen Minifier drin für css und js, interessant.

Du mauserst Dich zum Template Zampano!
Gruss
manu

manu wrote: ↑

Thu Jun 14, 2018 2:45 pm

Den Hamburger im Kopf- und die Navi im Fussbereicht finde ich ein sehr gelungener Ansatz. Was ich mir vielleicht noch wünsche, ist ein skiplink zur Navigation für die Barrierefreiheit.

Ik nixe spächä Switzerdütsch ))
Was meinst du mit "skiplink"?
Ich dachte, es ist barrierefrei.
Erstens kann man mit Accesskeys das Menü öffnen und schließen (FF: Alt-Shift-1 oder eben 2).
Zweitens erreicht man mit TAB den Hamburger auch ganz gut.
Oder meintest du einen Sprung nach unten?

manu wrote: ↑

Thu Jun 14, 2018 2:45 pm

... jetzt bist Du praktisch auf der Zielgeraden für ein Template ohne JS und dann kommen am Ende noch die (wohl spannenden) Animationen rein, die aber keinen Fallback haben. Ginge das nicht auch mit CSS Animation?

Erste Grundregel: Die Animationen sind nicht Pflicht!
Die muss man sowieso händisch setzen. Ich wollte nicht noch ein Plugin bzw. eine INI für Editoren bauen. Mit reinem CSS gehen Animationen wirklich gut - jedoch nicht Scrollposition-abhängig. (zumindest denke ich das)

manu wrote: ↑

Thu Jun 14, 2018 2:45 pm

Was an der :target Navigation etwas gewöhnungsbedürftig ist, ist das aufgeklappte Menü bei Seite zurück/history.back. Da würde ich - wenn schon JS - das schon von Christoph bemerkte Menü auf toggle modifizieren und den CSS fallback beibehalten.

Tatsächlich wollte ich ursprünglich mal ohne JS auskommen. Deshalb habe ich das :target-Menü so gelassen. Alles andere kam später hinzu (es musste was zappeln). Und ich finde den Anhang in der URL gar nicht so schlimm (# und #main-nav). Im "normalen" Besucherablauf spielt das keine große Rolle - Testern fällt es immer auf.

manu wrote: ↑

Thu Jun 14, 2018 2:45 pm

Was hast Du da denn für einen Minifier drin für css und js, interessant.

Das ist ein geheimes Plugin eines geheimen Programmierers im Hintergrund ))
Quatsch!
Das ist Holgers CnC (Cache&Compress für CMSimple_XH) von hier.

Außerdem habe ich noch Olafs "0page"-Plugin drin. Klein - aber OHO!

frase wrote: ↑

Thu Jun 14, 2018 3:40 pm

manu wrote: ↑

Thu Jun 14, 2018 2:45 pm

Den Hamburger im Kopf- und die Navi im Fussbereicht finde ich ein sehr gelungener Ansatz. Was ich mir vielleicht noch wünsche, ist ein skiplink zur Navigation für die Barrierefreiheit.

Ik nixe spächä Switzerdütsch ))
Was meinst du mit "skiplink"?

Schau mal hier unter Sprunglinks, einfach weil die Navi im Code am Ende ist.

manu wrote: ↑

Thu Jun 14, 2018 4:20 pm

Schau mal hier unter Sprunglinks, einfach weil die Navi im Code am Ende ist.

Ah ja. Danke.
Nun. Da muss ich sagen, dass das Template schon ganz schön viel bietet, was Zugänglichkeit betrifft.
Barrierefreiheit ist allerdings noch nicht zu 100% erreicht. Aber mit Accesskey-1 oder TAB kommt man schnell zur Navigation. Nur die Beschriftungen für Reader fehlen noch.
Mal sehen, ob ich noch Zeit finde ...

frase wrote: ↑

Thu Jun 14, 2018 3:40 pm

Nun. Da muss ich sagen, dass das Template schon ganz schön viel bietet, was Zugänglichkeit betrifft.
Barrierefreiheit ist allerdings noch nicht zu 100% erreicht. Aber mit Accesskey-1 oder TAB kommt man schnell zur Navigation.

Und was ist mit Natels?

cmb wrote: ↑

Thu Jun 14, 2018 4:40 pm

frase wrote: ↑

Thu Jun 14, 2018 3:40 pm

Nun. Da muss ich sagen, dass das Template schon ganz schön viel bietet, was Zugänglichkeit betrifft.
Barrierefreiheit ist allerdings noch nicht zu 100% erreicht. Aber mit Accesskey-1 oder TAB kommt man schnell zur Navigation.

Und was ist mit Natels?

Schwiizer händys?

manu wrote: ↑

Thu Jun 14, 2018 4:51 pm

Schwiizer händys?

Joar.