Top

JavaScript läuft NICHT

Baustein 1 — Parallax Hero

Der Hintergrund scrollt
langsamer als der Text.

02 Scroll-Fortschrittsbalken

Der blaue Balken ganz oben auf der Seite zeigt deinen Scroll-Fortschritt an — von 0 % (oben) bis 100 % (unten). Subtil, aber sofort wahrnehmbar. Scroll weiter um es zu sehen.

03 Text-Enthüllung (Wort für Wort)
Jedes Wort fährt einzeln von unten durch eine unsichtbare Maske herein — präzise, professionell, modern.
Baustein 04 — Split Einflug

Links kommt von links. Beim Scrollen.

Die linke Hälfte fliegt von links rein, die rechte Hälfte von rechts — gleichzeitig, mit leichtem Delay. Wirkt bei Technologie-Vergleichen oder Feature-Highlights perfekt.

Rechts kommt von rechts.

Zwei Welten treffen aufeinander.

Einsetzbar für Vorher/Nachher, Technologie vs. Ergebnis, oder einfach als visueller Rhythmuswechsel in langen Seiten. Kein externes Framework nötig.

05 Glassmorphism Karten

Karten aus mattem Glas — Backdrop-Filter Blur, halbtransparenter Hintergrund, subtile Kante. Beim Hover zieht ein Shine-Effekt durch. Funktioniert auf dunklem Hintergrund.

3.000+
Projekte weltweit

Abgeschlossene Prüf- und Automatisierungsprojekte aus drei Jahrzehnten Industrieerfahrung.

30 J.
Erfahrung

Aerospace, Automotive, Consumer, Defence, Industrial — die anspruchsvollsten Branchen.

100%
Inline-Prüfung

Jedes Bauteil, jeder Schritt — automatisch validiert bevor Fehler die Linie verlassen.

06 Zähler-Animation
0+
Projekte
0J.
Erfahrung
0%
Kundenzufriedenheit
0 Branchen
Industrien
07 Glow-Tracking Hover

Der Lichtfleck folgt dem Mauszeiger innerhalb der Karte — via CSS-Custom-Properties die per JS gesetzt werden. Kein Bild, kein SVG — nur 10 Zeilen JS.

Montageprüfung

Inline-Prüfung direkt am Montagepunkt. Hover und beobachte den Lichtfleck.

Zur Anwendung →
End-of-Line-Prüfung

100 % Prüfung vor dem Versand. Das Icon dreht sich beim Hover.

Zur Anwendung →
Retrofit & Modernisierung

Bestehende Anlagen aufrüsten. Glow folgt deiner Maus überall.

Zur Anwendung →
08 Sticky Stacking Karten

Karten stapeln sich beim Scrollen übereinander. Jede bleibt sticky an ihrer Position, die nächste schiebt sich darunter. Perfekt für Prozessschritte oder Feature-Listen.

↓ Scroll langsam durch diesen Bereich
Schritt 01
Anforderungsanalyse & Konzept

Gemeinsam definieren wir Prüfaufgabe, Taktzeit und Qualitätskriterien. Aus dem Lastenheft entsteht ein maßgeschneidertes Systemkonzept.

Schritt 02
Engineering & Softwareentwicklung

Mechanische Konstruktion, Steuerungstechnik und KI-Algorithmen werden parallel entwickelt — kurze Iterationszyklen, frühe Prototypen.

Schritt 03
FAT & Integration

Factory Acceptance Test beim Kunden oder bei uns — das System wird unter realen Bedingungen abgenommen, bevor es in die Linie geht.

Schritt 04
Inbetriebnahme & Support

Unsere Techniker bleiben bis zur Serienreife vor Ort. Remote-Wartung, Updates und Erweiterungen — über die gesamte Lebensdauer.

09 Clip-Path Enthüllung
Baustein 09 — Clip-Path

Das Bild wischt von links herein.

Clip-Path Inset startet bei inset(0 100% 0 0) und wird auf inset(0 0 0 0) animiert — das ergibt einen sauberen Wisch-Effekt von links nach rechts. Keine JavaScript-Library nötig, nur CSS + IntersectionObserver.

✓ Alle Bausteine TYPO3-kompatibel

Jeder dieser Bausteine funktioniert als einzelnes HTML-Inhaltselement in TYPO3. Sag welche du willst — ich integriere sie sauber in deine finale Startseite.