[free Template] fhs-anchorific-pure

Please post the URLs to pages, where you've made a CMSimple template available for download

Moderator: mikey

manu
Posts: 1086
Joined: Wed Jun 04, 2008 12:05 pm
Location: St. Gallen - Schweiz
Contact:

Re: [free Template] fhs-anchorific-pure

Post by manu » Tue Nov 27, 2018 2:51 pm

frase wrote:
Tue Nov 27, 2018 7:24 am
...
Die Transitionen haben hier - so scheints - tatsächlich ein Timing-Problem.
Entfernen in anchorific.min.css:
.anchorific li ul ul {
.anchorific li ul li ul {
.anchorific ul li a {
An diesen Stellen jeweils die beiden Transition-Regeln löschen.

@manu
Kannste das mal probieren und berichten?
...
Tatsächlich. Ohne die Transitions läuft es im Edge (EdgeHTML 17.17134). Wofür sind hier die Transitions überhaupt gut? In den anderen Browsern sehe ich keine Transition. Wenn ich im FF an der .secmenu fontsize fummle, sehe ich die Transition.

frase
Posts: 5085
Joined: Thu Apr 21, 2016 6:32 am
Location: Saxony
Contact:

Re: [free Template] fhs-anchorific-pure

Post by frase » Tue Nov 27, 2018 3:31 pm

manu wrote:
Tue Nov 27, 2018 2:51 pm
Wofür sind hier die Transitions überhaupt gut?
Pssssst, nicht so laut!
Wie in vielen meiner Templates, liegen an allen Ecken und Enden noch Leichen von stundenlangen Versuchen und Experimenten herum.
:D
Nun gut. So ganz sinnlos ist die Transition bei den Links nicht.
Mir war der Wechsel des grauen Hintergrundes viel zu hektisch. Ebendarum.
Nur, ich hatte mit allen möglichen Effekten probiert und vergessen, es nur auf die Hintergrundfarbe zu beschränken.
Also, statt "all" bitte "background-color" setzen.

Code: Select all

.anchorific ul li a {
	display: block;
	padding: .25em;
	-webkit-transition: background-color .3s ease-in;
	transition: background-color .3s ease-in;
	text-transform: uppercase;
}
Die anderen Transitionen (ul, li usw.) sind für das Aufklappen der Unterpunkte zuständig. Die könnte/sollte man vielleicht ganz entfernen, damit's im Edge gut läuft.

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

Re: [free Template] fhs-anchorific-pure

Post by cmb » Tue Nov 27, 2018 5:06 pm

frase wrote:
Tue Nov 27, 2018 3:31 pm
Die anderen Transitionen (ul, li usw.) sind für das Aufklappen der Unterpunkte zuständig. Die könnte/sollte man vielleicht ganz entfernen, damit's im Edge gut läuft.
Bin mir nicht sicher, ob das nur den Edge betrifft. Kann schon sein, dass auch andere Browser in einer künftigen Version betroffen sind.

Jedenfalls sollte man vielleicht gerade noch mal die Seite „Styles“ mit anderen Seiten vergleichen. Im Chrome ist nämlich gerade bei dieser Seite ein sehr großer Unterschied zwischen DOMContentLoaded und Load. Dafür scheint vor allem auch der eingebette Youtube-Player verantwortlich zu sein. Vielleicht kann man diesbezüglich optimieren?

Und auf jeden Fall ist es recht grausig, was CMSimple_XH (und die meisten Plugins und Templates) mit der JS-Script-Einbindung anstellt. Da wird es wirklich mal Zeit, dass wir das verbessern. <script> direkt vor </body> ist längst nicht mehr auf der Höhe der Zeit. Plugins und Templates sollten erwägen, diese statt dessen im <head> einzubinden, und mit dem defer Attribut zu versehen (bringt für Plugins aber wieder das alte leidige Problem bezüglich Pluginaufruf im Template, nachdem head() bereits aufgerufen wurde; da muss der Core was anbieten). Das ist allerdings bei jQuery nicht möglich; wäre daher wenigstens gut, wenn jQuery4CMSimple nicht nach $hjs, sondern nach $bjs schreibt (wobei das inkompatibel zu bestehenden Plugins sein könnte). Und vielleicht auch mal auf jQuery verzichten.
Christoph M. Becker – Plugins for CMSimple_XH

frase
Posts: 5085
Joined: Thu Apr 21, 2016 6:32 am
Location: Saxony
Contact:

Re: [free Template] fhs-anchorific-pure

Post by frase » Wed Nov 28, 2018 7:41 am

cmb wrote:
Tue Nov 27, 2018 5:06 pm
Jedenfalls sollte man vielleicht gerade noch mal die Seite „Styles“ mit anderen Seiten vergleichen. Im Chrome ist nämlich gerade bei dieser Seite ein sehr großer Unterschied zwischen DOMContentLoaded und Load. Dafür scheint vor allem auch der eingebette Youtube-Player verantwortlich zu sein. Vielleicht kann man diesbezüglich optimieren?
Hier ist die Frage: Meinst du die Seite "Styles" oder die Seite "Styles2"?
Im ersten Fall ist nur der Player von YouTube direkt im iFrame eingebunden.
Im zweiten Fall ist Holgers YouTube_Privacy-Plugin aktiv.
Gibt es da Unterschiede?
cmb wrote:
Tue Nov 27, 2018 5:06 pm
... Plugins und Templates sollten erwägen, diese statt dessen im <head> einzubinden, und mit dem defer Attribut zu versehen ...
Tja, da kann ich wegen Unwissenheit nicht mitreden.
Ich habe mir bei Timing- bzw. Ablauf-Problemen aber auch schonmal mit einem Preloader für jede Seite geholfen. (magicHero)
Unwissenheit hin oder her - ich habe dazu schon Stimmen gehört, die die Seitenübergänge als "angenehmer" bezeichneten. (Man muss es ja nicht so bunt machen.)

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

Re: [free Template] fhs-anchorific-pure

Post by cmb » Wed Nov 28, 2018 11:45 am

frase wrote:
Wed Nov 28, 2018 7:41 am
Hier ist die Frage: Meinst du die Seite "Styles" oder die Seite "Styles2"?
Im ersten Fall ist nur der Player von YouTube direkt im iFrame eingebunden.
Im zweiten Fall ist Holgers YouTube_Privacy-Plugin aktiv.
Gibt es da Unterschiede?
Ich meinte die Seite „Styles“. Du kannst dir das im Netzwerkanalyse-Tab der Firefox-Konsole auch selbst anschauen. Dort sieht man sehr schön, dass bei „Styles“ eine großer Abstand zwischen DOMContentLoaded und load ist (nicht aber bei „Styles2“). Das ist per se kein Problem, aber wenn z.B. ein Script im load Event das DOM oder CSSOM manipuliert, dann muss der Browser unter Umständen neu rendern/painten, und das könnte ähnliche Effekte wie beim Edge verursachen.
frase wrote:
Wed Nov 28, 2018 7:41 am
Ich habe mir bei Timing- bzw. Ablauf-Problemen aber auch schonmal mit einem Preloader für jede Seite geholfen. (magicHero)
Unwissenheit hin oder her - ich habe dazu schon Stimmen gehört, die die Seitenübergänge als "angenehmer" bezeichneten. (Man muss es ja nicht so bunt machen.)
Ein Preloader kann Performance-Probleme aber wohl eher nur kaschieren, nicht wirklich lösen. Traditionelle Script-Einbindung blockiert halt die weitere Verabeitung des DOM, eben weil ein Script z.B. per document.write zusätzliche Knoten erzeugen könnte. Das passiert nicht, wenn man das defer Attribut angibt (zumindest in halbwegs zeitgemäßen Browsern, die es eben unterstützen). Man muss dann halt nur aufpassen, dass nicht etwa andere Scripte das defer Script benötigen bevor dieses auch wirklich geladen wurde.
Christoph M. Becker – Plugins for CMSimple_XH

frase
Posts: 5085
Joined: Thu Apr 21, 2016 6:32 am
Location: Saxony
Contact:

Re: [free Template] fhs-anchorific-pure

Post by frase » Wed Nov 28, 2018 11:53 am

cmb wrote:
Wed Nov 28, 2018 11:45 am
Ein Preloader kann Performance-Probleme aber wohl eher nur kaschieren, nicht wirklich lösen.
Das war mir von Anfang an klar.
Man müsste halt wissen, wann man und wo "defer" oder gar "async" einsetzt.
Da muss ich noch lernen - und das dauert ... ;-)

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

Re: [free Template] fhs-anchorific-pure

Post by cmb » Wed Nov 28, 2018 12:48 pm

frase wrote:
Wed Nov 28, 2018 11:53 am
Man müsste halt wissen, wann man und wo "defer" oder gar "async" einsetzt.
Da muss ich noch lernen - und das dauert ... ;-)
Ist eigentlich ganz einfach: einfach für alle externen Scripte defer setzen, und im Script die Initialisierung direkt durchführen (statt in einem DOMContentLoaded-Handler).

Das Problem sind die Ausnahmen: das geht nicht für jQuery und Scripte, die jQuery verwenden. Es geht nicht, wenn das Script document.write() verwendet. Es geht nicht, wenn inline Scripte vorhanden sind, die das defer direkt Script nutzen. Es gibt Probleme mit Browsern, die defer nicht unterstützen.
Christoph M. Becker – Plugins for CMSimple_XH

manu
Posts: 1086
Joined: Wed Jun 04, 2008 12:05 pm
Location: St. Gallen - Schweiz
Contact:

Re: [free Template] fhs-anchorific-pure

Post by manu » Thu Nov 29, 2018 6:01 pm

frase wrote:
Tue Nov 27, 2018 3:31 pm
...
Also, statt "all" bitte "background-color" setzen.

Code: Select all

.anchorific ul li a {
	display: block;
	padding: .25em;
	-webkit-transition: background-color .3s ease-in;
	transition: background-color .3s ease-in;
	text-transform: uppercase;
}
Die anderen Transitionen (ul, li usw.) sind für das Aufklappen der Unterpunkte zuständig. Die könnte/sollte man vielleicht ganz entfernen, damit's im Edge gut läuft.
Das scheint zu funktionieren (alle Transitions raus, ausser bei >ul li a). Merci Frase

manu
Posts: 1086
Joined: Wed Jun 04, 2008 12:05 pm
Location: St. Gallen - Schweiz
Contact:

Re: [free Template] fhs-anchorific-pure

Post by manu » Thu Nov 29, 2018 6:06 pm

Noch ein Kommentar von Poweruser:
.clearfix get besser:

Code: Select all

.clearfix:before,.clearfix:after {
 content:" ";
 display:table
}
.clearfix:after {
 clear:both
}
..aus der Bootstrap Bibel abgekupfert 8-)

frase
Posts: 5085
Joined: Thu Apr 21, 2016 6:32 am
Location: Saxony
Contact:

Re: [free Template] fhs-anchorific-pure

Post by frase » Tue Dec 04, 2018 10:33 am

Apropos: Edge
Ein Gerücht

Post Reply