Dieses Problem tritt bei iOS oder Chrome nicht auf, sodass es sich nicht um ein Problem handelt, das mit Webkit zusammenhängt. Es scheint spezifisch für das neueste Safari 6.0.2 unter OS X 10.8.2 zu sein (und nicht durch 10.8.3 Preview Build 12D65, welches mit Safari 6.0.3 ausgeliefert wird). Ich werde in Kürze auf Lion 10.7.5 mit Safari 6.0.2 testen und werde auch auf Vorschau-Build 12D68 testen.
Hier ist eine Geige, die das Problem ziemlich offensichtlich macht. Wenn Sie einen Mac mit ML betreiben, sollten Sie einen deutlichen Unterschied zwischen Chrome und Safari feststellen, wo Safari ein Los flackert, wenn Sie die Maus bewegen.
Grundsätzlich besteht das Problem darin, dass Safari die Zieltransformation, die für ein einzelnes Bild festgelegt wird, intermittierend aus JS zeichnet und dann die Übergangsanimation fortsetzt. Dies verursacht ein Flackern, aber nur, wenn der Übergang in der Mitte war, um irgendwo zu beginnen. Also wird der Fehler seinen hässlichen Kopf nicht für die meisten (nicht intensive Nutzung) von CSS3-Übergängen aufwerfen, aber wenn Funktionalität oder visuelle Effekte darauf angewiesen sind, glatt zu einem Ziel zu interpolieren (wie mein aktuelles Projekt), ist dieses Flimmern nicht angenehm.
Ich habe ähnliche Themen im Zusammenhang mit Flimmern betrachtet und praktisch alle Kombinationen von Stilen angewendet, um Flimmern entgegenzuwirken, wie zum Beispiel -webkit-backface-visibility: hidden , wodurch verschiedene Elternelemente zur Hardwarebeschleunigung gezwungen werden, -webkit-transform-style: preserve-3d , -webkit-perspective: 1000 und keine von ihnen tun leider alles, um dieses Safari-spezifische Problem des Flackerns zu lösen, das heißt, flackert nicht zu weiß oder leer, sondern flackert zur Zieltransformation für einen einzelnen Rahmen .
Hier in diesem Zweig kannst du mir eine Reihe von Stilen zeigen, die beim "normalen Flackern" helfen, aber keine Wirkung für mich haben. Ссылка
Da dies kein webkitspezifisches Problem ist, bin ich mir nicht sicher, wo ich einen Fehlerbericht veröffentlichen soll. Es wäre besonders schön, das vor 10.8.3 zu veröffentlichen, da ich das als ein ziemlich großes Problem ansehe. Denken Sie daran, das ist die Art von Sache, die wir von HTML5 abhängig machen, damit es Flash wirklich auslöschen kann.
Aktualisierungen:
Es gibt verschiedene Möglichkeiten, das Flackern zu reduzieren. Das große Problem ist jedoch, dass sie "Hit and Miss" sind. Also musst du ein paar ausprobieren, um zu sehen, welches das Problem löst.
Aber sie drehen sich um die gleichen Dinge:
%Vor%Wenn das nicht ganz hilft, versuchen Sie:
%Vor%Wenn dies ebenfalls fehlschlägt, versuchen Sie Folgendes:
%Vor%Sie können über das W3C jedes einzelne davon lesen. Aber sie haben alle für mich unter verschiedenen Umständen mit nicht fließenden Animationen funktioniert, und flackernde, einschließlich einiger sehr merkwürdiger, viel sperriger als deine Geige.
Sie würden in das Div animiert gehen.
Tags und Links javascript css css3 css-transitions safari