Animation

[Michelle]

Hallo ihr Lieben,

wie mache ich denn eine solche Animation, wie in diesem Logo http://www.j-kelch.de/?

Liebe Grüße

Michelle

[woodfighter]

Tach,

wie mache ich denn eine solche Animation, wie in diesem Logo http://www.j-kelch.de/?

hoffentlich besser, die gezeigte funktioniert nur mit Javascript und damit standardmäßig in meinem Browser nicht; ich bin dafür kein Experte, aber ich denke das sollte mit CSS Transitions umsetzbar sein.

mfg
Woodfighter

[Gunnar Bittersmann]

@@woodfighter

wie mache ich denn eine solche Animation, wie in diesem Logo http://www.j-kelch.de/?

hoffentlich besser

Und schärfer. Man sieht deutlich[^1], was richtiger Text (scharf) und was Textgrafik (verwaschen) ist. Klarer Fall für srcset.

Apropos Textgrafik: Die ist als Hintergrundbild eingebunden, ein Alternativtext ist nicht vorhanden. Die Seite hat keine Überschrift. Und sowas von einem „Front-end Developer“[sic!], tsts.

LLAP 🖖

[quincunx]

Hallo Michelle,

in dieser Seite ist das über jQuery gelöst, auf codePen kannst du es evtl. nachvollziehen.

gr qx

[Michelle]

Danke 😀> Hallo Michelle,

in dieser Seite ist das über jQuery gelöst, auf codePen kannst du es evtl. nachvollziehen.

gr qx

[quincunx]

Danke 😀,

gerne,

der Hinweis von woodfighter es mittels css zu lösen, zwar nicht css-transition, aber mittels css-animation hat schon was !-) Schau selbst codePen, auch wenn ich JavaScript an anderer Stelle nicht missen möchte, ich liebe es, hier brauchst du es wirklich nicht.

gr qx

[woodfighter]

Tach,

der Hinweis von woodfighter es mittels css zu lösen, zwar nicht css-transition, aber mittels css-animation hat schon was !-)

manchmal kommt es mir hier so vor, als wäre ich in 'nem Webentwickler-Forum gelandet ;-) Aber zumindest habe ich jetzt gelernt, dass es da einen Unterschied gibt und was er ist.

mfg
Woodfighter

[Gunnar Bittersmann]

@@woodfighter

der Hinweis von woodfighter es mittels css zu lösen, zwar nicht css-transition, aber mittels css-animation hat schon was !-)

manchmal kommt es mir hier so vor, als wäre ich in 'nem Webentwickler-Forum gelandet ;-) Aber zumindest habe ich jetzt gelernt, dass es da einen Unterschied gibt und was er ist.

Man kann sich auch mal das Wort transition auf der Zunge zergehen lassen – Übergang. Zu einem Übergang gehört ein Woher und ein Wohin; ein Anfangs- und ein Endzustand. Das kann :not(:hover) / :hover sein oder :focus / :not(:focus) oder :checked / :not(:checked) …

Eine Animation läuft von selbst. Stoppt von selbst nach einem Durchlauf oder auch nicht …

LLAP 🖖