RESOURCES
Auf dieser Website habe Ich eine große Auswahl an Repositorys und Vorlagen benutzt, die von viel intelligenteren Menschen als mir entwickelt wurden.
Dies ist eine Übersicht der verwendeten Materialien.
Text-reveal
Dieser Text-Decoder Effekt wurde original von @Techartist entworfen, ich habe den Code dahingehend angepasst, dass jeder Buchstabe nacheinander "revealed" wird & der Effekt beim Laden der Seite getriggert wird. Außerdem eine Anpassung der reveal-Zeit.
See the Pen Text Decoder Animation by Techartist (@VoXelo) on CodePen.
Footer-Ticker
Beim Footer-Ticker habe ich diesen Pen von @Samuel Beard als Anfang genommen und das Konzept erweitert. Ich habe das CSS angepasst, die Funktionalität verbessert, um einen true infinite-ticker zu erstellen und einen stopp der animation beim hovern festgelegt.
See the Pen Infinite Ticker by Samuel Beard (@samuelbeard) on CodePen.
Cursor
Bei meinem Cursor habe Ich Insparation vom unten stehenden Projekt genommen. Ich habe einen größeren Kreis gewählt, es ohne den zweiten kreis programmiert und das CSS angepasst. Einige funktionen habe ich außerdem hinzugefügt, wie zum Beispiel eine automatische farbanpassung und Hover Effekt per CSS.
See the Pen Circle cursor with blend mode by Clement Girault (@clementGir) on CodePen.
Anderes
Außer den obenstehenden Beispielen habe Ich noch verschiedene Bibliotheken benutzt, welche ich hier auflisten werde:
- GSAP - Für Animationen und Übergänge auf der Website.
- ScrollOut.js - Für Scroll-basierte Animationen und Effekte.
- jQuery - Für DOM-Manipulationen
- Modernizr - Für die Erkennung von HTML5- und CSS3-Funktionen im Browser.
- Lenis - für einen Smoothen Scroll-Effekt.