TolgaTatli/Moon

bug: using browser's Back button causes content to disappear (Safari/iOS)

csphilli opened this issue · 5 comments

Regardless of where you are within your site, using the back button instead of the site coded back button will cause the page to fade out entirely. All that remains is the hamburger icon and the background. The majority of users will be confused and probably leave the site. And the majority of users will be using the back button instead of the predefined code for backwards navigation.

Has anyone manually fixed this on their end and would you please post the solution if you have?

It seems to be a Safari only issue. Tested on Chrome without issue.

This has been raised before but lost in translation: #12

Also tested on mobile (iOS). All that is left is the hamburger icon.

Great looking theme, but this flaw is a deal breaker for anyone wanting to drive high volume commercial traffic to their site.

Only for completeness, this is what happens: https://www.dropbox.com/s/e537ys6e0ass3vb/MoonError.mov?dl=0

The problem seems that Safari don't fire $(document).ready({...}) function on back button click, in which the <div class="container fadeOut"> is replaced with <div class="container fadeIn">. In fact, I tried to add an alert in this function and, while Chrome fires it on each page loading, Safari don't show any alert when Back Button is pressed.

After several attempts, I edit /assets/js/scripts.js changing line 20 from $(document).ready(function(){} to window.onpageshow(function() { and it seems to solve the problem. Here the file edited (with some other stuff): https://github.com/alessandro308/Moon