Schlagwörterarchiv: Animationen

3 einfache und schöne CSS3 Menüs mit coolen Mouse-Over-Effekten

Wie Sie ganz einfach 3 tolle und interessante CSS3-Menüs erstellen

3-css3-menüs-hover-effekte

In meinem heutigen kurzen Blogartikel möchte ich Ihnen zeigen, wie Sie 3 ganz einfache und elegante CSS3-Menüs erstellen können. Die Original-Menüs stammen von Callum Williams und wurden von diesem ursprünglich am 21. September 2013 auf Codepen.io veröffentlicht.

Den Original-Code zu den 3 Beispielen können Sie im Originalartikel (unter dem Share-Button) oder aber hier herunterladen: CSS3-Menüs: 3 coole Hover-Effekte

Weiterlesen

8 einfache CSS3 Transitions (Übergänge/Überblendungen) erstellen

8 tolle CSS3 Übergänge, welche den Leser so richtig beeindrucken

CSS3-Transitions - 8 Beispiele

CSS3 bietet dem Nutzer eine Vielzahl von Möglichkeiten, um verblüffende und wunderschöne »Transitions« (Übergänge und Überblendungen) zu erstellen und in HTML-Webseiten einzubauen.

Dass mit CSS3 interessante Animationen und Effekte ohne Javascript erstellt werden können, ist schon lange bekannt. Dabei werden HTML-Elemente mit :hover und :focus zuverlässig in allen Browsern animiert. Die dabei erreichten Animationen wirken mit :hover oder :focus fast wie ein Schalter: an, aus, an, aus.

Begriffsbestimmung

Eine Transition ist als ein fließender Übergang oder eine langsame Überblendung einer CSS-Eigenschaft auf einer Zeitachse zu verstehen. Wo Sie bislang bei einem Mouseover eine Farbe wie auf Knopfdruck ändern konnten, geschieht dies über eine Transition in einer langsamen Verwandlung.

Weiterlesen