Ich weiß. Sie hassen Parallaxe. Was sollten wir mehr hassen? Wenn Dinge, die früher im Web funktionierten, aufhören zu funktionieren, ohne klare Warnung oder Ahnung, warum.
Schon 2014 bloggte Keith Clark einen außergewöhnlich cleveren CSS-Trick, bei dem man im Wesentlichen eine CSS-Transformation verwendet, um ein Element so zu skalieren, dass es anders scrollt, und es dann durch „Tiefenkorrektur“ wieder auf die „normale“ Größe bringt. Es sieht so aus, als hätten wir fünf Jahre Spaß damit gehabt, aber in iOS 13 funktioniert es nicht mehr.
Hier ist ein Video von offiziellen Simulatoren und dem Problem
- Amelia sagt „3D-Transformationen sind kein stabiler Standard“, was mir Angst macht. Sind sie nicht ungeprefixert?
- iOS 13 hat auch die „Scroll-Schatten“ kaputt gemacht, weil sie angeblich gescannte Ansichten cachen oder so?
- Adam hat einen ganzen Artikel zu diesem Konzept verfasst, und ich bin sicher, er ist nicht allein.
Ich möchte meine Hand heben, um das wieder in Ordnung zu bringen. Wenn wir das Web nicht überwachen, wird alles leiden.
Das ist sehr interessant für mich, denn die Art und Weise, wie dieser „Trick“ umgesetzt wird, ist eigentlich gar kein Trick. Tatsächlich ist es eine der wenigen Implementierungen des Parallax-Effekts, die *kein* Trick ist. Parallax-Scrolling-Effekte sollen Tiefe simulieren, indem sie das Scrollverhalten verschiedener Elemente verändern. Bei dieser Implementierung wird all dies umgangen, indem die Tiefe einfach „echt“ gemacht wird. iOS 13 verhindert also nicht, dass dieser Effekt funktioniert, indem es eine Fehlverwendung von CSS-Transformationen behebt, sondern es zerstört aktiv etwas, das bisher korrekt angewendet wurde.
Du hast es genau richtig gesagt
Gut gesagt, das hier ist ein großes WTF
Deshalb können wir keine schönen Dinge haben...
Ist es nicht umgekehrt, dass die z-Translation dazu führt, dass es mit einer anderen Geschwindigkeit scrollt und man dann seine Größe korrigieren muss, indem man es skaliert?
Angesichts der vielen Fehler in iOS 13 würde ich wetten, dass dies ein Fehler in Safari ist und keine Funktion.
Entschuldigung Chris, aber 3D-Transformationen sind tatsächlich ein Arbeitsentwurf. Also... ähm... es ist ein bisschen gruselig (für mich ^^'), aber dies ist kein stabiler Zustand.
Es werden die Überlaufeigenschaften auf dem übergeordneten Container sein, die das verursachen.
Ich habe versucht, diese zu entfernen, und es wurde wieder korrekt skaliert, obwohl die Überlaufeigenschaften natürlich notwendig sind, um den Parallax-Effekt zu erzeugen, daher kann ich es nicht weiter testen.
Seltsamerweise war es die Tatsache, dass dieser Fehler zu einer Zeit auch in IE/Edge existierte (vielleicht tut er das immer noch), die mich in diese Richtung geführt hat. Ich fange an zu denken, dass die Leute, die sagen „Safari ist das neue IE“, recht haben könnten.
Gibt es dafür schon einen Workaround / eine Lösung?
Ich habe die Themes Twentynineteen und Twentytwenty nicht ausprobiert. Eine Frage: Haben die Themes Twentynineteen und Twentytwenty auch den sogenannten Parallax-Effekt!? Haben sie Parallax-Fähigkeiten!?
Das Twenty Twenty Theme besagt: (auf der WordPress-Seite)
Zitat
Unser Standard-Theme für 2020 ist darauf ausgelegt, die Flexibilität des Block-Editors voll auszuschöpfen. Organisationen und Unternehmen haben die Möglichkeit, dynamische Landingpages mit endlosen Layouts zu erstellen, indem sie die Gruppen- und Spaltenblöcke verwenden. Die zentrierte Inhaltsspalte und die fein abgestimmte Typografie machen es auch perfekt für traditionelle Blogs. Vollständige Editor-Stile geben Ihnen eine gute Vorstellung davon, wie Ihre Inhalte aussehen werden, noch bevor Sie sie veröffentlichen. Sie können Ihrer Website eine persönliche Note verleihen, indem Sie die Hintergrundfarben und die Akzentfarbe im Customizer ändern. Die Farben aller Elemente auf Ihrer Website werden automatisch basierend auf den von Ihnen gewählten Farben berechnet, um einen hohen, zugänglichen Farbkontrast für Ihre Besucher zu gewährleisten.
Das ist sehr beeindruckend: Die Frage für mich ist: Haben die Themes Twentynineteen und Twentytwenty auch den sogenannten Parallax-Effekt!? Haben sie Parallax-Fähigkeiten!?
Hallo – kein der beiden Themes enthält Parallax von Haus aus (soweit ich weiß), aber Parallax ist etwas, das Sie hinzufügen können, vorzugsweise in einem Child-Theme.
Komm schon Apple. Wollt ihr alle verärgern!?
Behebt das.