[content-memory] Content-Memory

Im Rahmen eines aktuellen Projekts haben wir eine kleine CSS3-Spielerei umgesetzt, die wir euch nicht vorenthalten wollen:
Ein Inhaltselement, das Vor- und Rückseite hat und sich beim Drübergehen mit der Maus (bzw. auswählen mit dem Finger auf mobilen Geräten) umdreht. Es verhält sich also quasi wie eine (Memory-)Karte die man umdreht und wieder zurück… Daher der Name :)

Das Ganze funktioniert als einzelnes FE-Element oder als umschließender Container (vom Prinzip wie beim Akkordeon) für andere FE-Elemente.

Besonderheiten:

• funktioniert ohne Javascript
• CSS 2.1 Fallback für ältere Browser (gleiches Resultat ohne den Umdreheffekt)
• sollte auf allen modernen Browsern laufen

Voraussetzungen:

• Contao 3.1+

Informationen:
Aktuell sollte (wenn Packagist mitspielt) das Modul bereits im Composer installierbar sein.

• Beispiel: http://wangaz.github.io/contao-content-memory/
• GitHub: https://github.com/wangaz/contao-content-memory/

Fehler in der composer.json

Code:

---

        "src/system/modules/content-memory":"system/modules/coneten-memory"

---

Sollte jetzt laufen :)

Noch schöner würde es aussehen, wenn du beim transform: auch noch eine perspective(...) mit angibst ;) - bzw. dem .ce_contentmemory das Attribut perspective:... geben. Wobei dann sieht der Effekt nicht mehr richtig aus mit vorne und hinten.

Hmmm…

Grundsätzlich hast du natürlich schon recht, schließlich handelt es sich streng genommen ja um eine 3D-Animation. Folgendes würde dagegen sprechen: Zum Einen ist die Perspektive aktuell nicht verschoben, was den u.g. Code zur Folge hätte und somit auch standardmäßig von allen Browsern generiert wird. Zum Anderen kann man die Karte als 2D ansehen…

HTML-Code:

---

perspective: 0;

---

Welchen Vorteil hätte man deiner Meinung nach durch perspective?

Zitat:

---

Zitat von Elvador

Welchen Vorteil hätte man deiner Meinung nach durch perspective?

---

Dass es dann so aussieht, wie wenn man tatsächlich eine Karte umdrehen würde ;). Deine reale perspektive wäre ja auch nicht eine Parallel-Projektion.

Das überzeugt…
Ich werde da bei Gelegenheit mal ein wenig herumexperimentieren :)