https://wiki.stephanschlegel.de/api.php?action=feedcontributions&feedformat=atom&user=46.5.255.79 Wikizone - Benutzerbeiträge [de] 2026-05-06T22:00:24Z Benutzerbeiträge MediaWiki 1.35.14 https://wiki.stephanschlegel.de/index.php?title=Anime.js&diff=25185 Anime.js 2021-01-16T15:16:09Z <p>46.5.255.79: </p> <hr /> <div>Anime.js ist ein Animation Framework.<br /> <br /> == Links ==<br /> <br /> https://animejs.com/<br /> https://www.youtube.com/watch?v=uRDLFXxihgc - guter Einstieg<br /> https://codepen.io/rexjbull/pen/RwRRezq Beispiel mit Scrollmagic<br /> <br /> == Quickstart ==<br /> <br /> * create anime object <br /> anime({});<br /> * pass configuration object<br /> ** target (CSS selector)<br /> ** css properties die animiert werden sollen<br /> <br /> &lt;syntaxhighlight lang=&quot;javascript&quot;&gt;<br /> anime({<br /> targets: &#039;.square&#039;,<br /> translateX: &#039;250px&#039;,<br /> });<br /> &lt;/syntaxhighlight&gt;<br /> <br /> === Mehr Properties ===<br /> <br /> &lt;syntaxhighlight lang=&quot;javascript&quot;&gt;<br /> anime({<br /> targets: &#039;.square&#039;,<br /> translateX: &#039;250px&#039;,<br /> rotateZ: 360,<br /> scale: 2,<br /> loop: true,<br /> duration: 5000,<br /> });<br /> &lt;/syntaxhighlight&gt;<br /> <br /> === Besonderheiten ===<br /> Anime.js kann einige besondere Dinge:<br /> * Animieren von &#039;&#039;&#039;JavaScript Objekten&#039;&#039;&#039; (mit mindestens einem Zahlenwert)<br /> * Animieren von &#039;&#039;&#039;DOM Attributen&#039;&#039;&#039;<br /> <br /> == Staggering ==<br /> https://animejs.com/documentation/#staggeringBasics</div> 46.5.255.79 https://wiki.stephanschlegel.de/index.php?title=Anime.js&diff=25184 Anime.js 2021-01-16T15:14:35Z <p>46.5.255.79: /* Quickstart */</p> <hr /> <div>Anime.js ist ein Animation Framework.<br /> <br /> == Links ==<br /> <br /> https://animejs.com/<br /> https://www.youtube.com/watch?v=uRDLFXxihgc - guter Einstieg<br /> https://codepen.io/rexjbull/pen/RwRRezq Beispiel mit Scrollmagic<br /> <br /> == Quickstart ==<br /> <br /> * create anime object <br /> anime({});<br /> * pass configuration object<br /> ** target (CSS selector)<br /> ** css properties die animiert werden sollen<br /> <br /> &lt;syntaxhighlight lang=&quot;javascript&quot;&gt;<br /> anime({<br /> targets: &#039;.square&#039;,<br /> translateX: &#039;250px&#039;,<br /> });<br /> &lt;/syntaxhighlight&gt;<br /> <br /> === Mehr Properties ===<br /> <br /> &lt;syntaxhighlight lang=&quot;javascript&quot;&gt;<br /> anime({<br /> targets: &#039;.square&#039;,<br /> translateX: &#039;250px&#039;,<br /> rotateZ: 360,<br /> scale: 2,<br /> loop: true,<br /> duration: 5000,<br /> });<br /> &lt;/syntaxhighlight&gt;<br /> <br /> === Besonderheiten ===<br /> Anime.js kann einige besondere Dinge:<br /> * Animieren von &#039;&#039;&#039;JavaScript Objekten&#039;&#039;&#039; (mit mindestens einem Zahlenwert)<br /> * Animieren von &#039;&#039;&#039;DOM Attributen&#039;&#039;&#039;</div> 46.5.255.79