Удаление адресной строки из браузера (для просмотра на Android)

Кто-нибудь знает, как я могу удалить адресную строку из браузера Android, чтобы лучше просматривать мое веб-приложение и сделать его больше похожим на нативное приложение?

Источник

11 ответов

Решение

Вы можете сделать это с помощью следующего кода

 if(navigator.userAgent.match(/Android/i)){
    window.scrollTo(0,1);
 }

Я надеюсь, что это поможет вам!

Источник

Вот решение NON-JQuery, которое мгновенно удаляет адресную строку без прокрутки. Кроме того, это работает, когда вы поворачиваете ориентацию браузера.

function hideAddressBar(){
  if(document.documentElement.scrollHeight<window.outerHeight/window.devicePixelRatio)
    document.documentElement.style.height=(window.outerHeight/window.devicePixelRatio)+'px';
  setTimeout(window.scrollTo(1,1),0);
}
window.addEventListener("load",function(){hideAddressBar();});
window.addEventListener("orientationchange",function(){hideAddressBar();});

Он должен работать и с iPhone, но я не смог это проверить.

Источник

Если вы загрузили jQuery, вы можете увидеть, больше ли высота содержимого, чем высота области просмотра. Если нет, то вы можете сделать это такой высоты (или чуть меньше). Я запустил следующий код в режиме WVGA800 в эмуляторе Android, а затем запустил его на своем Samsung Galaxy Tab, и в обоих случаях он скрыл адресную строку.

$(document).ready(function() {

  if (navigator.userAgent.match(/Android/i)) {
    window.scrollTo(0,0); // reset in case prev not scrolled  
    var nPageH = $(document).height();
    var nViewH = window.outerHeight;
    if (nViewH > nPageH) {
      nViewH -= 250;
      $('BODY').css('height',nViewH + 'px');
    }
    window.scrollTo(0,1);
  }

});
Источник

Ссылаясь на ответ Воломике, я бы предложил заменить строку

nViewH -= 250;

с

nViewH = nViewH / window.devicePixelRatio;

Он работает точно так же, как я проверяю на HTC Magic (PixelRatio = 1) и Samsung Galaxy Tab 7" (PixelRatio = 1.5).

Источник

Проблема большинства из них заключается в том, что пользователь все еще может прокручивать вверх и видеть адресную строку. Чтобы сделать постоянное решение, вы должны добавить это.

//WHENEVER the user scrolls
$(window).scroll(function(){
    //if you reach the top
    if ($(window).scrollTop() == 0)   
    //scroll back down  
    {window.scrollTo(1,1)}
})
Источник

Нижеследующее работает для меня каждый раз..

На этом сайте также есть несколько других предложений, но этот, не несуразный, беспокоящий, доступен в github:gist и отвечает на ваш вопрос (вставлен здесь для удобства):

function hideAddressBar()
{
  if(!window.location.hash)
  {
      if(document.height < window.outerHeight)
      {
          document.body.style.height = (window.outerHeight + 50) + 'px';
      }

      setTimeout( function(){ window.scrollTo(0, 1); }, 50 );
  }
}

window.addEventListener("load", function(){ if(!window.pageYOffset){ hideAddressBar(); } } );
window.addEventListener("orientationchange", hideAddressBar );

Насколько я могу судить, комбинация дополнительной высоты, добавленной на страницу (которая вызвала у вас проблемы) и оператора scrollTo(), приводит к исчезновению адресной строки.

С того же сайта "простейшим" решением для сокрытия адресной строки является использование метода scrollTo():

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

Это будет скрывать адресную строку, пока пользователь не прокрутит.

Этот сайт помещает тот же метод в функцию тайм-аута (обоснование не объясняется, но он утверждает, что код не работает без него):

// When ready...
window.addEventListener("load",function() {
  // Set a timeout...
  setTimeout(function(){
    // Hide the address bar!
     window.scrollTo(0, 1);
  }, 0);
});
Источник

Это работает на Android (по крайней мере, на складе пряник браузера):

<body onload="document.body.style.height=(2*window.innerHeight-window.outerHeight)+'px';"></body>

далее, если вы хотите отключить прокрутку, вы можете использовать

setInterval(function(){window.scrollTo(1,0)},50);
Источник

Я надеюсь, что это также полезно

window.addEventListener("load", function() 
{
    if(!window.pageYOffset)
    { 
        hideAddressBar(); 
    }
    window.addEventListener("orientationchange", hideAddressBar);
});
Источник

Вот пример, который гарантирует, что тело имеет минимальную высоту экрана устройства, а также скрывает полосу прокрутки. Он использует событие DOMSubtreeModified, но выполняет проверку только каждые 400 мс, чтобы избежать потери производительности.

var page_size_check = null, q_body;
(q_body = $('#body')).bind('DOMSubtreeModified', function() {
  if (page_size_check === null) {
    return;
  }
  page_size_check = setTimeout(function() {
    q_body.css('height', '');
    if (q_body.height() < window.innerHeight) {
      q_body.css('height', window.innerHeight + 'px');
    }
    if (!(window.pageYOffset > 1)) {
      window.scrollTo(0, 1);
    }
    page_size_check = null;
  }, 400);
});

Проверено на Android и iPhone.

Источник

Наконец я пытаюсь с этим. Это сработало для меня..

  public void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_ebook);

    //webview use to call own site
    webview =(WebView)findViewById(R.id.webView1);

    webview.setWebViewClient(new WebViewClient());       
    webview .getSettings().setJavaScriptEnabled(true);
    webview .getSettings().setDomStorageEnabled(true);     
    webview.loadUrl("http://www.google.com"); 
}

и весь ваш main.xml(res/layout) должен выглядеть так:

<WebView  xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/webView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>

не идите, чтобы добавить макеты.

Источник

Я обнаружил, что если вы добавите команду для выгрузки, он удерживает страницу вниз, т.е. страницу, которая перемещается! Надеюсь, что это работает с вами тоже!

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

Используя 7-дюймовый планшет с android, www.kupsoft.com зайдите на мой сайт и проверьте, как ведет себя страница, я использую эту команду на своем портале.

Источник
Другие вопросы по тегам