Übergänge in CSS
CSS sollte bevorzugt zur Umsetzung von Animationen verwendet werden. JavaScript wird dann nur zur Erledigung von Aufgaben eingesetzt, die nicht mit CSS realisiert werden können.
Es folgt ein einfaches kleines Beispiel, dessen Details hier aber noch nicht vollständig beschrieben werden. (Diese Lektion ist noch relativ neu und soll später weiter ausformuliert werden.)
Main.html<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head><meta charset="UTF-8" />
<meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
<title>Main</title><style type="text/css">p
{ font-size: 10vw;
transition: font-size 2s linear; }p:hover
{ font-size: 20vw; }</style></head><body>
<p>abc</p>
<pre><code><script>/*<![CDATA[*/
/*]]>*/</script></code></pre></body></html>