Animationen
NEU: Ab SOLO 3.1 lassen sich Elemente und Module animieren. Dafür gibt es eine js_animations.html5, die über das Seitenlayout eingebunden wird und CSS-Klassen in der Theme Toolbox für folgende Animationen:
Animationen werden ausgeführt, wenn Elemente von unten in den sichtbaren Bereich gescrollt werden. Elemente oberhalb des sichtbaren Bereichs (zum Beispiel nach einem Reload, während sich die Person am Ende der Seite befand) werden direkt angezeigt.
Da es innerhalb von Modulen nur mit Template-Änderungen möglich wäre, Inhalten zusätzliche CSS-Klassen zu geben, gibt es über die js_animations.html5 zusätzlich die Möglichkeit, Klassen zu definieren, die – wenn sie in den sichtbaren Bereich gescrollt werden – animiert werden sollen. Beispiele für individuelle Animationen sind
In der js_animations.html5 sieht der Aufruf für den animierten Hero so aus:
animate('.hero--animate', 0);
// 0 bedeutet, dass mehrere Hero-Elemente nicht mit einer
// standardmäßigen Verzögerung von 0.3s animiert werden,
// sondern sofort
In der _animations.html5 wird die Klasse dann folgendermaßen zur Animation verwendet:
// hero animation
.hero--animate {
&.animate--visible {
.hero__headline,
.hero__description,
.hero__links {
@include animate-fade-right;
animation-duration: 1s;
}
.hero__description {
animation-delay: 0.3s;
}
.hero__links {
animation-delay: 0.6s;
}
}
}
Fade-In Effekt
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Fade-In + Move-Up Effekt
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Fade-In + Move-Left Effekt
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Fade-In + Move-Right Effekt
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Animierter Hero
Die Elemente Überschrift, Text und Link werden nacheinander von links eingeblendet
Animierte News
3 Uhr nachts: Wie ein Backup-Konzept den Ernstfall entschärft
Ransomware-Alarm um 3 Uhr nachts – und trotzdem kein Grund zur Panik. Wie ein durchdachtes Backup-Konzept mit Acronis den Ernstfall auf 20 Minuten begrenzt.
Weiterlesen … 3 Uhr nachts: Wie ein Backup-Konzept den Ernstfall entschärft
Der 31. November: Wie eine KI-Plausibilitätsprüfung teure Fehler verhindert
Ein Verfallsdatum, das es nicht gibt – und niemand hat es bemerkt. Wie KI-gestützte Plausibilitätsprüfung mit nexilo AI solche Fehler künftig abfängt.
Weiterlesen … Der 31. November: Wie eine KI-Plausibilitätsprüfung teure Fehler verhindert
Vom Alarm zur Abwehr: Cybersicherheitskonzept mit Arctic Wolf
Honeypots erkennen den Angriff, Playbooks steuern die Reaktion: Wie wir ein Cybersicherheitskonzept mit gezieltem, kontrolliertem Lockdown statt Panik aufgebaut haben.
Weiterlesen … Vom Alarm zur Abwehr: Cybersicherheitskonzept mit Arctic Wolf