Tweet
Guten Morgen,
meine Frage bezieht sich auf diesen Pen:
https://codepen.io/ghaste/pen/YzBJWgL
Wenn man die Maus bewegt, erscheinen "glitzernde" Symbole, die durch Manipulation aller drei Dimension, x,y und z, nach unten "fallen".
Nun habe ich es bislang so gelernt, dass wenn ich 3dimensionale Transformationen machen will, das Elternelement des beabsichtigten 3D Elementes das "perspective" Attribut braucht, erst dann kann ich beim 3D Element die gewünschten Effekte erziehlen.
Wenn das 3D Element dann noch Kindelemente hat, welche zusätzlich eigene 3D Effekte haben sollen, ERST DANN muss ich dem 3D Element "transform-style: preserve-3d" geben.
In diesem Pen gibt es aber nicht ein Elternelement mit "perspective". Das 3D Element, hier die .star Elemente haben einfach nur "transform-style: preserve-3d" und trotzdem funktioniert es. Die eigentlichen 3d Elemente sind die ::before Pseudoelemente von .star, ist mir bewusst, ncihts destotrotz fehlt mir das das "perspective". Ich habe versucht, es simpel nachzubauen, indem ich einem 1px mal 1px breiten Element , welche auch nur preserve-3d besitzt, ein Kindelement hab und weder das Element, noch sein Kind haben 3D Effekte.
Was ist hier die Besonderheit und warum funktioniert es?
Liebe Grüße
meine Frage bezieht sich auf diesen Pen:
https://codepen.io/ghaste/pen/YzBJWgL
Wenn man die Maus bewegt, erscheinen "glitzernde" Symbole, die durch Manipulation aller drei Dimension, x,y und z, nach unten "fallen".
Nun habe ich es bislang so gelernt, dass wenn ich 3dimensionale Transformationen machen will, das Elternelement des beabsichtigten 3D Elementes das "perspective" Attribut braucht, erst dann kann ich beim 3D Element die gewünschten Effekte erziehlen.
Wenn das 3D Element dann noch Kindelemente hat, welche zusätzlich eigene 3D Effekte haben sollen, ERST DANN muss ich dem 3D Element "transform-style: preserve-3d" geben.
In diesem Pen gibt es aber nicht ein Elternelement mit "perspective". Das 3D Element, hier die .star Elemente haben einfach nur "transform-style: preserve-3d" und trotzdem funktioniert es. Die eigentlichen 3d Elemente sind die ::before Pseudoelemente von .star, ist mir bewusst, ncihts destotrotz fehlt mir das das "perspective". Ich habe versucht, es simpel nachzubauen, indem ich einem 1px mal 1px breiten Element , welche auch nur preserve-3d besitzt, ein Kindelement hab und weder das Element, noch sein Kind haben 3D Effekte.
Was ist hier die Besonderheit und warum funktioniert es?
Liebe Grüße