Fix javascript to work on Safari, and iOS, etc.
New here? Learn about Bountify and follow @bountify to get notified of new bounties! x

I have a JavaScript function that pops up a link/button that will let the user animated scroll back to the top of the page when they are reading long articles. The script works on macOS Chrome, Firefox, and Opera. It also works on Windows Firefox. Finally, it works on Android Chrome and Firefox.

However, it doesn't work on iOS browsers, macOS Safari, or Windows Edge or Chrome. I am looking for someone to get this working consistently across browsers and operating systems.

https://codepen.io/garyrozanc/pen/vbGzaj

awarded to weslly
Tags
javascript

Crowdsource coding tasks.

1 Solution

Winning solution

https://codepen.io/anon/pen/YBqJrg

document.documentElement is unsupported on most browsers, it will work if you replace it with document.scrollingElement

Can you try it on iOS browsers? I doesn't seem to be working on them. The button isn't showing up when starting to scroll.
imokyourok 6 months ago
@imokyourok which version of iOS?
weslly 6 months ago
I'm using iOS 12. But I guess anything that works on iOS 11 or higher would be fine.
imokyourok 6 months ago
I'm using iOS 12. But I guess anything that works on iOS 11 or higher would be fine. Also, I noticed that the button does show in iOS, it just takes longer to show up due to the difference in scroll length between desktop and mobile.
imokyourok 6 months ago
@imokyourok I just tested on iOS 12 and it works fine, but not when running on codepen, since it won't recognize the scroll position of the iframe on iOS.
weslly 6 months ago