Fade Animation & Demure Theme Javascript Slider

Dieser Slider ist smart und modern, mit klaren Linien und einem attraktiven Blau, Grau und Weiß im Farbschema.

Dieser moderne Slider gebraucht ausschließlich CCS3 Techniken und reduziert so die Ladezeiten ohne sich dabei auf jQuerry verlassen zu müssen. Wie man erwarten würde, ist er dabei vollständig responsive, wobei sich sehr viel Gedanken gemacht wurde, um die einwandfreie Funktion bei den unterschiedlichen Bildschirmgrößen zu gewährleisten.

Die meisten Animationstechniken sind einfach und lassen den Slider modern und sauber aussehen und lenken auch deshalb nicht von den Hauptbildern ab. Zum Beispiel ändert sich jedes Bild über einen gewöhnlichen Fade.

Wenn man mit der Maus über die Slideshow fährt, erscheinen zusätzliche Elemente. Diese sind teilweise transparente graue Boxen. In jeder Box ist ein weißes Icon, die ähnlich wie eine Tür in die richtige Position klappen. Insgesamt ist der Effekt sehr stilvoll und modern.

Beim Überfahren der Icons mit der Maus, werden diese blau und formen sich zu einem Quadrat. Im Falle der beiden Pfeile, wächst das Rechteck in der Breite, um die Kanten des Sliders zu erreichen. Dies hat zwei Folgen: Erstens verdeutlicht dies, dass man mit den Icons interagieren kann und zweitens erzeugt dies ein größeres Textfeld, die besonders auf kleineren Bildschirmen sinnvoll sind.

Durch das Klicken auf die Icons kann der User vor und zurück in der Slideshow gehen, oder diese weiterlaufen oder pausieren lassen.

Es ist auch möglich, dass man einige Slides überspringt, indem man die Symbole unten anklickt. Diese sind graue Kreise, die jeweils eines der Bilder entsprechen. Lädt ein Bild neu, wird der entsprechende Kreis blau. Es lädt außerdem eine Vorschau, wenn man mit der Maus über die Kreise fährt, die auch durch Anklicken lädt.

Es gibt auch einen Titel und einen Untertitel in der unteren linken Ecke. Dieser ist weiß und auf einem teilweise transparenten grauen Untergrund zu finden. Beide Rechtecke erscheinen vom oberen Rand her. Der Text hat die Schriftart ‘Roboto’, einer natürlichen und freundlichen Schriftart.

Insgesamt ist dieses Design sehr flexibel und kann für eine Vielzahl an Webseiten gebraucht werden, einschließlich Blogs, Online Shops, Reise und Tourismusseiten usw. Es ist sehr attraktiv und modern und garantiert deinen Besuchern einen positiven ersten Eindruck. Weiterhin passen die Farben gut zusammen, obwohl man diese natürlich auch ändern kann, um zu der übrigen Webseite besser einzupassen.