Ihre Website in 3D mit Meny und CSS 3D Transforms

CSS 3d Transforms sind häufiger Thema bei Dr. Web. Diese Technik erlaubt komplexe, dabei beeindruckende Effekte, die ansonsten nur mit proprietärer Software, etwa Flash, möglich wären. Heute präsentieren wir Ihnen mit dem CSS3-Experiment Meny eine weitere Möglichkeit der Anwendung von CSS 3D Transforms.


3D-Meny: die Startseite

Was ist Meny?

Meny ist ein Experiment. Es demonstriert, wie CSS3 3D-Transforms auch zur Erstellung eines Navigationsmenüs eingesetzt werden können. Das Schöne an Mey ist, dass Sie es nicht erst umständlich implementieren müssen, vielmehr reicht es, diesem Link „lab.hakim.se/meny/?http://“ beispielsweise „drweb.de/magazin“ hinzuzufügen. Der Link wird dann folgendermaßen ausschauen: http://lab.hakim.se/meny/?http://drweb.de/magazin. Klicken Sie mal und bewegen die Maus an den linken Browserrand…

Ein spezieller Falteffekt an der linken Seite wird sichtbar, wenn man den Parameter #fold hinzufügt. Also so: http://lab.hakim.se/meny/?http://drweb.de/magazin#fold

Wie das Ergebnis dann aussehen soll, zeige ich Ihnen an Beispielen einiger meiner Lieblingswebseiten:


Beispiel 1: Smashingmagazine


Beispiel 2: Spiegel


Beispiel 3: DrWeb


Beispiel 4: Planet-Wissen

Hier werden die CSS3-Transforms zur Rotation verwendet. JavaScript reagiert dabei auf die Bewegung des Mauszeigers.

Nicht auf alle Webseiten und nicht in allen Browsern lassen sich diese Transformationen anwenden. Fraglich auch, ob sich 3D-Bedienung je wird durchsetzen können. Auch in der echten Welt sind Elemente, die Aktionen veranlassen sollen, etwa Fernbedienungen, Stromschalter, Zündschlösser etc.  herkömmlicherweise nur an der Front zu bedienen. Kreativ ist es in jedem Falle…

(dpe)

Neben dem Chemiestudium interessiert sich Swetlana Senkevitch für sehr viele Dinge dieser Welt. Kunst, Malerei, Psychologie, Naturwissenschaften, Schachspiel, Sprachen und Photographie sind nur einige Beispiele ihrer Interessen und Hobbies. Sie hat eine Leidenschaft fürs Schreiben und Design gefunden und beschäftigt sich nun mit Webdesign.

Sortiert nach:   neueste | älteste | beste Bewertung
gnome2fan
Gast
gnome2fan
3 Jahre 11 Monate her

Funzt nicht in Opera 12 (Ubuntu 11.04). In den Browsern des Marktführers vermutlich auch nicht …

Dirk Schmidt
Gast
Dirk Schmidt
3 Jahre 11 Monate her

Beeindruckende Effekte, die ansonsten nur mit proprietärer Software, etwa Flash, möglich wären? Wird wirklich mal Zeit, sich mit SVG zu beschäftigen. Das funktioniert dann auch mit (fast) allen Browsern. Sogar, wenn JavaScript ausgeschaltet ist. Und das ist auf Firmenrechnern meistens der Fall …

wpDiscuz

Mit der Nutzung unseres Angebots erklärst du dich damit einverstanden, dass wir Cookies verwenden. Weitere Informationen

Wir verwenden Cookies, um Inhalte und Anzeigen zu personalisieren, Funktionen für soziale Medien anzubieten und die Zugriffe auf unsere Website zu analysieren. Dadurch geben wir nicht personenbezogene Informationen zur Nutzung unserer Website an unsere Partner für soziale Medien, Werbung und Analysen weiter. Nähere Informationen findest du in unserer Datenschutzerklärung. Durch die Weiternutzung unserer Website (oder das ausdrückliche Klicken auf "Einverstanden") gehen wir davon aus, dass du mit der Verwendung von Cookies einverstanden bist.

Schließen