Cover flow
0 0 
Tim Tepaße
0 at
Cover flow
Jeder kennt ja, dass Cover flow von Itunes also das wo man die ganzen Bilder in einer Reihenfolge sieht.
Jetzt ist mir die frage aufgekommen ob man das nicht auch in HTMl einbetten kann? Und statt den Covern einfach andere Bilder nehmen...nur ich habe keine ahnung wie ich das aufbauen soll! Ob mit perl/Php/java script?
-
Hallo,
Jeder kennt ja, dass Cover flow von Itunes also das wo man die ganzen Bilder in einer Reihenfolge sieht.
ich kenne das zwar nicht (außer einer Erwähnung hier im Forum),
Jetzt ist mir die frage aufgekommen ob man das nicht auch in HTMl einbetten kann? Und statt den Covern einfach andere Bilder nehmen...nur ich habe keine ahnung wie ich das aufbauen soll! Ob mit perl/Php/java script?
Mit Javascript könntest Du etwas vergleichbares erreichen. Du benötigst ganz sicher eine clientseitige Programmiersprache. Damit fallen Perl und PHP weg.
Freundliche Grüße
Vinzenz
-
Hallo,
Jetzt ist mir die frage aufgekommen ob man das nicht auch in HTMl einbetten kann? Und statt den Covern einfach andere Bilder nehmen...nur ich habe keine ahnung wie ich das aufbauen soll! Ob mit perl/Php/java script?
Es handelt sich um eine GUI-Geschichte im Browser, also Javascript. Tatsächlich macht Apple das in ihren automatisch aus iPhoto veröffentlichten .Mac-Galerien. Ein Beispiel dafür findest Du hier - der Darstellungseffekt „Karussel“. Du bemerkst zwei Dinge daran, es hat eine ziemliche Ladezeit, da all die verschiedenen Bildern in groß geladen werden müssen und es ist ziemlich rechenintensiv.
Wirf mal ein Blick in das (urheberrechtlich geschützte, also nicht klaubare) Skript, das das ganze betreibt. Mal abgesehen davon, dass das offensichtlich minifiziert wurde, ist das immer noch ein riesiger Aufwand. Es müssen Bilder geladen werden, diese Bilder absolut positioniert werden, bei Maus-Events muss eine Bewegung eingeleitet werden, dabei müssen alle sichtbaren Bilder horizontal bewegt und in der Größe geändert werden, dazu steht bei Apple wirklicj jemand auf diese nervigen Reflektionen, also müssen die (vermutlich) mit dem Element <canvas> nachgebildet werden ... wenn man genau hinschaut, ist die Animation nicht linear, sondern langsam am Anfang und Ende in schneller in der Mitte, also muß dafür noch gesorgt werden.
Und das alles in Javascript, mit dem man sich all die Funktionen von Grund auf aufbauen muß. Das ist nicht mehr die normale Webseite aus Kansas, das ist schon richtige GUI-Entwicklung. Aber ja, es ist möglich und es wäre vermutlich auch sauberer zu bauen, als Apfel das derzeit tut. Wenn man Spaß hat, kann man auch noch SVG reinmixen, um mit schiefen Bildern den dreidimensionalen Effekt des tatschlichen CoverFlows nachzuahmen.
Will man das? Sich diese viele Arbeit machen? Ich bin da zwiespältig, schon allein, weil ich es etwas absurd finde, wenn eine Webseite es schafft, meinen Lüfter zum starken Laufen zu bringen. Andererseits liegt dort wohl langfristig das Wesen von Webseiten mit starker Programmiertechnik dahinter. Bei den .mac-Galerien hab ich immer noch das Bauchgefühl, dass HTML/CSS/JS dort mißbraucht wird. Eine passende Lösung wie z.B. hier diese rein auf SVG und JS basierende Galerie mit Dock-Effekt finde ich da schöner. Auch eine Masse von JS, aber es fühlt sich alles viel sauberer an.
(Solltest Du das wirklich programmieren wollen, kann ich Dir nur raten, klein anzufangen und Schritte zu machen. Erst Bilder mit JS dynamisch laden und absolut (bzw. relativ zum Viewport) zu positionieren, dann lernen, wie man Bilder programmatisch in der Größe ändern und sie verschiebt. Dann über Keyboard- und Mausrad-Events lernen. Das dann verknüpfen. Kleine Wissenlegosteine, je mehr man hat, desto eher kann man sich so etwas selbst zusammenbasteln.)
Tim
-
Hallo.
wenn man genau hinschaut, ist die Animation nicht linear, sondern langsam am Anfang und Ende in schneller in der Mitte, also muß dafür noch gesorgt werden.
Und außerdem kennt sie Schwung bei der Mausbewegung.
MfG, at
-
