`transform: translateY` on page container causes iOS Safari to snap

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Screen.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Screen.js
index ec9e726feb1f931e419e5607d3863bb77c16d964..85f768e65bc931e2b559403e67348a22f918c604 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Screen.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Screen.js
@@ -6,12 +6,13 @@
  * @license    GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @module     WoltLabSuite/Core/Ui/Screen
  */
-define(['Core', 'Dictionary'], function(Core, Dictionary) {
+define(['Core', 'Dictionary', 'Environment'], function(Core, Dictionary, Environment) {
        "use strict";
        
        var _mql = new Dictionary();
        var _scrollDisableCounter = 0;
-       var _scrollOffsetFrom;
+       var _scrollOffsetFrom = null;
+       var _scrollTop = 0;
        
        var _mqMap = Dictionary.fromObject({
                'screen-xs': '(max-width: 544px)',                              /* smartphone */
@@ -96,14 +97,18 @@ define(['Core', 'Dictionary'], function(Core, Dictionary) {
                 */
                scrollDisable: function() {
                        if (_scrollDisableCounter === 0) {
-                               var h = document.body.scrollTop;
+                               _scrollTop = document.body.scrollTop;
                                _scrollOffsetFrom = 'body';
-                               if (!h) {
-                                       h = document.documentElement.scrollTop;
+                               if (!_scrollTop) {
+                                       _scrollTop = document.documentElement.scrollTop;
                                        _scrollOffsetFrom = 'documentElement';
                                }
                                
-                               elById('pageContainer').style.setProperty('transform', 'translateY(-' + h + 'px)');
+                               // setting translateY causes Mobile Safari to snap
+                               if (Environment.platform() !== 'ios') {
+                                       elById('pageContainer').style.setProperty('transform', 'translateY(-' + _scrollTop + 'px)', '');
+                               }
+                               
                                document.documentElement.classList.add('disableScrolling');
                        }
                        
@@ -119,10 +124,13 @@ define(['Core', 'Dictionary'], function(Core, Dictionary) {
                                
                                if (_scrollDisableCounter === 0) {
                                        document.documentElement.classList.remove('disableScrolling');
-                                       var h = elById('pageContainer').style.getPropertyValue('transform').match(/translateY\(-(\d+)px\)/);
-                                       elById('pageContainer').style.removeProperty('transform');
-                                       if (h) {
-                                               document[_scrollOffsetFrom].scrollTop = ~~h[1];
+                                       
+                                       if (_scrollTop) {
+                                               document[_scrollOffsetFrom].scrollTop = ~~_scrollTop;
+                                       }
+                                       
+                                       if (Environment.platform() !== 'ios') {
+                                               elById('pageContainer').style.removeProperty('transform');
                                        }
                                }
                        }