2016-05-19 4 views
3

Ich habe ein Experiment zu infinite-scroll the first billion digits of Pi erstellt, um eine Scroll-Lösung zu finden/zu erstellen, die eine hohe Leistung mit einem riesigen Dataset bietet. Ich begann mit iScroll zu testen und stieß auf ein Problem.CSS3-Transformation: Maximaler Wert übersetzen?

infinite-scroll the first billion digits of Pi

Diese Demo funktioniert gut (in Chrome) bis rund 33 Millionen transform: translate(0px, 3.35545e+07px);

Sie das Problem, indem Sie die folgenden Befehle in der Entwickler-Tools-Konsole Scrollen sehen kann, dann.

scroller.scrollTo(0, -33553700); scroller._execEvent('scroll'); 

Alle CSS-Experten kennen die Grenzen der transform: translate?

Update: FYI, ich sehe das gleiche Problem bei ~ 33 Millionen bei der Verwendung von position: absolute.

+0

zu sein scheint, scheint seltsam nahe dem 25-Bit-Wert von 33.554.432 – Firsh

Antwort

0

Für Firefox, der maximale Maßstab() Multiplikator ist gleich dem maximalen Browser CSS Höhe/Breite/Element Höhe/Breite. Wenn die Höhe/Breite Ihres berechneten Elements diese Grenze überschreitet, wird Ihr Element nicht mehr skaliert.

Manche Leute sagen, in Chrom die maximale Skala() Multiplikator/Teiler 10000

+0

Interessant, aber so einfach klar sein, ich bin nicht auf der Suche um irgendeinen Inhalt zu skalieren, wird einfach die Position des Elements übersetzt (damit ich sie problemlos recyceln kann). FYI Ich sah das gleiche Problem bei 33 Millionen bei der Verwendung von "Position: absolute". – daniellmb