Ratgeber: "HTML, CSS, Javascript & PHP"

3D-Effekt für Verknüpfungen mit CSS

Wer den Verknüpfungen auf seiner Website einen unvergesslichen und doch dezenten Effekt verleihen möchte, hat es inzwischen nicht mehr gerade einfach. Wir zeigen Ihnen wie Sie einfach einen eindruckvollen 3D-Effekt zu Ihren Links hinzufügen.

© Archiv

3D-Effekt für Verknüpfungen mit CSS

Es scheint, als sei das letzte Wort in Sachen spannender :hover-Effekte längst gesprochen und es ließe sich niemand mehr mit dezent einladenden Verknüpfungen hinter den Ofen hervorlocken.Wer dennoch beim Website-Besucher originelle Eindrücke hinterlassen möchten, kann die :hover-Interaktivität in die dritte Dimension bringen.Der Einsatz von Flash ist hierzu keine Voraussetzung. Beim Markup brauchen Sie keine gesonderten Vorkehrungen zu treffen;es dreht sich alles um eine ganz gewöhnliche Syntax einer rein traditionellen Verknüpfung:

<a href="http://www.magnus.de/">Internet Magazin</a>

Dass benötigte CSS beinhaltet:

body {
font-family: sans-serif;
background: #333;
color: #eee;
}
a {
text-decoration: none;
color: hsl(206, 80%, 50%);
}
.roll {
display: inline-block;
overflow: hidden;
vertical-align: top;
-webkit-perspective: 400px;
-moz-perspective: 400px;
-webkit-perspective-origin: 50% 50%;
-moz-perspective-origin: 50% 50%;
}
.roll span {
display: block;
position: relative;

Mehr lesen

Chronologische Liste und Netflix-Links -

Neuerscheinungen in der Übersicht -

Vorschau auf Film- und Serien-Highlights -

Mehr zum Thema

Ratgeber: "Webdesign"

Gleiche Rechte für alle - genau das macht auf Websites nicht immer Sinn. Wir zeigen Ihnen, wie Sie mit Joomla Rechte differenziert vergeben können.
Ratgeber: "HTML, CSS, Javascript & PHP"

Viele Website-Betreiber schützen ihre Formulare vor Spam mit Captchas; Captchas sind jedoch bei den Besuchern unbeliebt. Wer eine stressfreie…
Design für Smartphones

Sie wollen Ihrer mobilen Webseite ein individuelles Aussehen geben oder beim Laden der Seite eine Meldung anzeigen lassen? Wir zeigen Ihnen, wie Sie…
Ratgeber: "Bildbearbeitung"

Der Cloud sei Dank entstehen im Netz immer mehr Werkzeuge, die komplexe Rechenprozesse in einfache Interfaces packen. Das gilt auch für die…
Ratgeber: "Web-Business"

Neben Magento fristen verschiedene Shopsysteme ein Mauerblümchendasein. Doch zu Unrecht finden Lösungen wie Opencart wenig Beachtung. (Dr. Holger…