paitakht_pc
paitakht_pc

Reputation: 27

how hide address bar in mobile using javascript or css

we want to know how we can to hide address bar of mobile browser. we see few topics about of this problem and we test them and don't working. please check your code is hide address bar and help me to know how we should to do

we want to hide mobile browser address bar (URL bar) with using javascript or css.

enter image description here

thanks everyone for help

Upvotes: 0

Views: 7416

Answers (2)

pixelcreated
pixelcreated

Reputation: 196

Extended solution from above. This should cover all bases for you. Next time please share your own attempts first:

// Extended solution for hiding address bar:

(function() {
    
  var browser = window,
      doc = browser.document;

  // If there's a hash, or addEventListener is undefined, stop here
  if ( !location.hash || !browser.addEventListener ) {

    //set to 1
    window.scrollTo( 0, 1 );
    var scrollTop = 1,

    //reset to 0 if needed
    checkWindowBody = setInterval(function(){
      if( doc.body ){
        clearInterval( checkWindowBody );
        scrollTop = "scrollTop" in doc.body ? doc.body.scrollTop : 1;
        browser.scrollTo( 0, scrollTop === 1 ? 0 : 1 );
      } 
    }, 15 );

    if (browser.addEventListener) {
      browser.addEventListener("load", function(){
        setTimeout(function(){
          //reset to hide address
          browser.scrollTo( 0, scrollTop === 1 ? 0 : 1 );
        }, 0);
      }, false );
    }
  }

})();

Upvotes: 0

JS_basic_knowledge
JS_basic_knowledge

Reputation: 117

What code have you tried previously?

This is a pretty standard way of hiding the address bar in mobile.

// New event listener:
window.addEventListener("load",function() {
    setTimeout(function(){
        // Hide the address bar:
        window.scrollTo(0, 1);
    }, 0);
});

JSFiddle to demonstrate: https://jsfiddle.net/bjcra2vx/

Upvotes: 1

Related Questions