#animationen

Drag and Drop mit Angular und D3.js-Animationen: Ein nützlicher Ghost

Weiter geht's mit Angular und D3.js: Im ersten Teil zu Drag and Drop mit Angular haben wir es bereits geschafft, unsere Elemente zu verschieben und über unserer Landing-Zone wieder fallen zu lassen – und das Browser-kompatibel! Nun schauen wir uns gemeinsam an, wie wir unser eigenes Ghost-Element für die Drag-and-Drop-Operation Browser-übergreifend implementieren können.

webinale & International PHP Conference 2017 sind eröffnet

Die beiden Partnerkonferenzen IPC und webinale gehen in eine neue Runde und bieten digitalen Professionals, Trendsettern und Machern im World Wide Web die Möglichkeit, altes Wissen aufzufrischen, neues Wissen zu generieren und zu feiern. Feiern? Ja, denn die webinale feiert in diesem Jahr ihren zehnten Geburtstag.

Fast Forward: Python Fire ist Open Source & Git LFS 2.0.0 ist erschienen

Heute im Fast Forward: Google hat Python Fire Open Source zur Verfügung gestellt und Git LFS 2.0.0 ist mit vielen Neuerungen erschienen. Außerdem: Dank sogenannter "differential download packages" verringert Microsoft die Update-Größen von Insider Preview Builds, so lassen sich Android-Apps mit Flutter in IntelliJ erstellen und das steckt in RxJS.

mo.js – So kommt Bewegung ins Web

Um Animationen im Web zu erstellen, nutzen die meisten Libraries auf dem Markt die Möglichkeit, Elemente im DOM oder SVG DOM zu animieren. Dass es auch anders geht, beweist die noch relativ neue JavaScript-Library mo.js, die beim Erstellen von effektvollen Animationen im Web hilft.

AOS – Leichtgewichtige Animate-on-Scroll-Library

Um Elemente auf einer Website beim Scrollen zu animieren, gibt es bereits zahlreiche Libraries auf dem Markt. Das Problem an der Sache: Gerade bei umfangreichen Seiten hat der Webentwickler nur wenig Kontrolle, außerdem werden die Animationen vollständig von JavaScript gehandhabt, indem Inline-CSS eingefügt wird. Einen anderen Ansatz fährt deswegen die leichtgewichtige Animate-on-Scroll-Library AOS.

WAIT! ANIMATE – CSS-Animationen leicht gemacht

CSS bietet von Haus aus kaum eine (einfache) Möglichkeit, um Animationen zu stoppen, bevor sie wieder von vorne beginnen. Es gibt zwar die Methode animation-delay, sie führt aber lediglich zu einer Verzögerung beim Start der Animation. Das Tool WAIT! ANIMATE ermöglicht hingegen die Konfiguration von Animationsbewegungen und -zeiten ganz ohne JavaScript.

Fast Forward: Firefox 47, Docker für PHP-Entwickler & ASP.NET Core Bug-Bounty-Programm

Heute geht es mal wieder updatelastig im Fast Forward zu: So ist Firefox 47 erschienen, es gibt Neues zur App-Entwicklung unter Windows 10 Anniversary sowie ein neues .NET und ASP.NET Core Bug-Bounty-Programm. Außerdem an Bord: ein Webinar-Tipp zum Thema "Docker für PHP-Entwickler", Tipps zum Umgang mit CSS-Animationen und Microsoft zeigt, wie man Edge in Unternehmen verwaltet.

Fast Forward Spezial: Animationen richtig einsetzen, Navigationsleisten & Foundation 6

Während in einem Großteil der Bundesländer Feiertag ist, gibt es aber doch einige, die heute arbeiten müssen. Ein guter Grund also, euch mit diesem Fast Forward Spezial ein wenig den Tag zu verschönern. Als Thema dient dafür der große Bereich Webdesign - dabei ist alles von Tipps und Tricks zur Arbeit mit Animationen und Navigationen, über das richtige Einstellen von Veröffentlichungszeiträumen auf Websites bis hin zur Arbeit mit Foundation 6.

Fast Forward Spezial: Responsive Images, Google Fonts & One-Page-Webdesign

Weiter geht’s im Fast Forward Spezial, heute mit dem Thema Webdesign. Wir haben insgesamt fünf Artikel zusammengetragen, die von Grundlagen zu Detailfragen alle Ebenen der Webseitengestaltung abdecken. Wir starten bei Responsive Images, sprechen Google Fonts an und versuchen, Animationen per Style-Sheet unter Kontrolle zu bringen. Abschließend kann man sich über die Grundsätze des One-Page-Webdesigns sowie Animationen im Responsive Webdesign informieren.

X
- Gib Deinen Standort ein -
- or -