问题
I created an experiment to infinite-scroll the first billion digits of Pi to find/create a scrolling solution that has high-performance with a massive dataset. I started testing with iScroll and ran into an issue.
This demo works great (in Chrome) till around 33 million transform: translate(0px, 3.35545e+07px);
You can see the issue by running the following commands in the dev tools console, then scrolling.
scroller.scrollTo(0, -33553700); scroller._execEvent('scroll');
Any CSS experts know the limits of transform: translate?
Update: FYI, I see the same issue at ~33 million when using position: absolute.
回答1:
For firefox, the maximum scale() multiplier is equal to the maximum browser CSS height/width / element height/width. If your calculated element's height/width exceeds this limit, then your element won't be scaled anymore.
Some people say , In chrome the maximum scale() multiplier/divider seems to be 10000
来源：https://stackoverflow.com/questions/37330152/css3-transform-translate-maximum-value