From 3a446f1f9dfa00dff6fa2bbf1a5eeb4fd19c8b25 Mon Sep 17 00:00:00 2001 From: Grant Bourque Date: Tue, 12 Jun 2018 00:48:54 -0500 Subject: [PATCH] Use `document.scrollingElement` for mobile scrolls - Set `document.scrollingElement` as the scrolling element for scrolling to anchors when the app is mobile mode to enhance support in newer browsers. The CSS View Module spec considers `document.documentElement`/`` to be the standard scrolling element and that is what appears to be used in the latest Firefox and Chrome. However, some older browsers and even the current Safari use `document.body` as the scrolling element which is why I suspect the original code used `document.body`. Since some browsers scroll on different elements, `document.scrollingElement` exists so the browser can tell us what to use for scrolling to anchors work for all modern browsers. Since `document.scrollingElement` is undefined in older browsers, `document.body` is available as fallback mobile scrolling element. --- assets/javascripts/views/content/content.coffee | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/assets/javascripts/views/content/content.coffee b/assets/javascripts/views/content/content.coffee index 7cf99409..8c5ba874 100644 --- a/assets/javascripts/views/content/content.coffee +++ b/assets/javascripts/views/content/content.coffee @@ -19,7 +19,10 @@ class app.views.Content extends app.View after: 'afterRoute' init: -> - @scrollEl = if app.isMobile() then document.body else @el + @scrollEl = if app.isMobile() + (document.scrollingElement || document.body) + else + @el @scrollMap = {} @scrollStack = []