2012-03-23 16 views
0

誰かがHTML/javascriptを使用してフルスクリーンのようにAndroidでURLを非表示にする方法を知っていますか?HTML/javascriptを使用してAndroid 2.3のブラウザでURLを非表示にする

iPad(Safari)ではこれは簡単で、いくつかのメタタグを使用して行うことができます。

私はそのような何か試してみました:

$(document).ready(function() { 
scrollTo(0, 1); 
}); 

をしかし、モトローラT1に、URLバーはまだ:(

+0

ページがスクロールするのに十分な長さであることを確認してください。 – codaniel

答えて

0

この

$(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); 
} 
}); 

を試してみてください表示され、それもあなたの場合は動作しますページの長さが足りません

0

これを試してみましたが、これはAndroidで完全に動作しているようです。さん、ここから:
アンドロイド4.1.1

とサムスンS3ミニ電話で私のために働いた。しかし、私が言及したURLを踏襲しており、絶対的に正しいがあった上で任意のソリューションの https://gist.github.com/1183357

/* 
* Normalized hide address bar for iOS & Android 
* (c) Scott Jehl, scottjehl.com 
* MIT License 
*/ 
(function(win){ 
var doc = win.document; 

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

    //scroll to 1 
    window.scrollTo(0, 1); 
    var scrollTop = 1, 
     getScrollTop = function(){ 
      return win.pageYOffset || doc.compatMode === "CSS1Compat" && doc.documentElement.scrollTop || doc.body.scrollTop || 0; 
     }, 

     //reset to 0 on bodyready, if needed 
     bodycheck = setInterval(function(){ 
      if(doc.body){ 
       clearInterval(bodycheck); 
       scrollTop = getScrollTop(); 
       win.scrollTo(0, scrollTop === 1 ? 0 : 1); 
      } 
     }, 15); 

    win.addEventListener("load", function(){ 
     setTimeout(function(){ 
      //at load, if user hasn't scrolled more than 20 or so... 
      if(getScrollTop() < 20){ 
       //reset to hide addr bar at onload 
       win.scrollTo(0, scrollTop === 1 ? 0 : 1); 
      } 
     }, 0); 
    }); 
} 
})(this); 
1

なし溶液。 ありがとうございます。

https://gist.github.com/1183357

参照Fresheyeballの実装。これはポートレートモードとランドスケープモードでも完全に機能します。

私はちょうどここに私の完全な例をコピーします。もちろん

<!DOCTYPE html> 
<html> 
    <head> 
     <title></title> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
     <script type="text/javascript" src="jquery-1.8.3.min.js"></script> 
     <script type="text/javascript"> 
      $(function() { 
       hideAddressBar(); 
      }); 

      function hideAddressBar() { 
       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 = nViewH/window.devicePixelRatio; 
         $('BODY').css('height', nViewH + 'px'); 
        } 
        window.scrollTo(0, 1); 
       } else { 
        addEventListener("load", function() { 
         setTimeout(hideURLbar, 0); 
         setTimeout(hideURLbar, 500); 
        }, false); 
       } 
       function hideURLbar() { 
        if (!pageYOffset) { 
         window.scrollTo(0, 1); 
        } 
       } 
       return this; 
      } 
     </script> 
    </head> 
    <body> 
     <section> 
      <div> 
       <h1>First title</h1> 
       <p>Just some content</p> 
      </div> 
     </section> 
     <section> 
      <div>Any text</div> 
     </section> 
    </body> 
</html> 

あなたは正しく順序でも、この例の作業をjQueryのメインのjsファイルを配置する必要があります。ここからダウンロードできますhttp://jquery.com/download/

関連する問題