BonBon Buttons: Anschauliche CSS3-Schaltflächen
Zum Freitag gibt es heute etwas Süßes: Die BonBon Buttons von Simurai stellen eine gute Mischung aus kompaktem CSS3-Code und kreativen Ecken-Effekten dar. Der Entwickler hat die Schaltflächen mit dem Ziel umgesetzt, möglichst wenig Code zu schreiben und die Schaltflächen dabei dennoch flexibel zu halten. Das Resultat kann sich sehen lassen — neben den plastischen Beleuchtungen sorgt vor allem ein Rauschen (Noise) als Hintergrundbild für die entsprechende Haptik.
Das Schöne an den Buttons sind die Möglichkeiten, das Aussehen sehr einfach anzupassen. Dies wurde durch die Verwendung von mehreren CSS-Klassen ermöglicht:
- <a href="#" class="button pink serif glossy skew">Link</a>
So können beispielsweise die Glanzeffekte durch das Entfernen der "glossy"-Klasse ausgeschaltet werden.
Der Entwickler der bunten Buttons sieht der Realität allerdings ins Auge und empfiehlt momentan noch nicht die Verwendung seiner CSS-Kompositionen — die Schaltflächen sollen als Demonstration der neuen CSS3-Effekte angesehen werden und lassen sich zudem nur schwierig in einen Webdesign-Stil integrieren. Für die Darstellung von CSS3-Effekten ist stets ein moderner Browser erforderlich. Bis genug Benutzer in diesen Genuss gekommen sind, wird sicherlich noch eine Weile vergehen.