Question

I am hiding my address bar, in Safari on an iPhone using this script:

window.addEventListener("load",function() {
setTimeout(function(){
window.scrollTo(0, 1);
}, 0);
});

The problem is if the page doesn’t fully load and the user scrolls down, when it finishes loading it shoots back up again. I want to make this more defensive, so when a user moves the phone and clears the address bar themselves, it will not do it again.

This was my attempt which didn’t work:

window.addEventListener("load",function() {
setTimeout(function(){
  if(window > 1){

  }
  else
  {
window.scrollTo(0, 1);
}}, 0);
});

Just in case anyone says I was going to do a if(!window … and take out the else but wanted to keep it like this for testing purposes, marks out the possibility of me writing it wrong.

Any ideas?

Answer 1

Use document.body.scrollTop instead of simply window:

window.addEventListener("load",function() {
    setTimeout(function() {
        if (document.body.scrollTop > 1) {
            // Do your testing here...
        } else {
            window.scrollTo(0, 1);
        }
    }, 0);
});

---

When you’re done testing, you could collapse it all into 1 line:

window.addEventListener("load",function() {
    setTimeout(function() {
        document.body.scrollTop || window.scrollTo(0, 1);
    }, 0);
});