Hide address bar in mobile Safari with reader button

Question

Ok, so I use the suggested window-scrollTo method , and it just works smoothly everywhere except for one small anchor point.

When Safari decides to show the Reader button, believing that I might want to save my page for later reading, it holds the address bar for 5 seconds before finally hiding it as I asked. A view of eternity in UX time.

Is it iOS 6, or does it also do it in iOS 5? (I don't have 5 devices to test at the moment.) Also, is there any way around this?

Answer 1

I looked around a bit and there seemed to be no way to disable the read button. The only possible solution I found is to make your site less clear, so Safari doesn't add a read button. Exactly what makes the site “readable” is rather gloomy.

Here are some studies on what makes something “readable”: http://mathiasbynens.be/notes/safari-reader

Here is a way to make it less readable by putting your content in CSS: http://askmike.org/2012/12/a-hacky-way-to-remove-the-reader-button-in-ios-safari/

The bottom line is that there is no solution. Hopefully Apple will add a meta tag to disable it, or at least allow us to hide the address bar faster.

Answer 2

Here is what worked for me:

I placed all the contents inside the ol tag.

<ol style = "padding:0;margin:0"> my content </ol> 

From what I read elsewhere, the reader is partially caused by the number of words on the page, but does not take into account the words inside ol.

Answer 3

You can disable the button reader by hiding the content that launches it.

And then displaying this content 1 s after loading the page.

For example, hide all your <p> elements if they trigger the button reader.