Home Explore Help
Register Sign In
chenxixian
/
devdocs
mirror of https://github.com/freeCodeCamp/devdocs
1
0
Fork 0
Files Issues 0 Wiki
Browse Source

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`/`<html>`
  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.
Grant Bourque 7 years ago
parent
66f69d88d0
commit
d657377d1c
1 changed files with 4 additions and 1 deletions
Split View Show Diff Stats
  1. 4 1
      assets/javascripts/views/content/content.coffee

+ 4 - 1
assets/javascripts/views/content/content.coffee
View File 

@@ -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 = []