web-dev-qa-db-ja.com

iOSのSafariでアドレスバーを削除する方法

Window.scrollTo(0,1);の古いトリック。動作しません。さらに悪いことに、アドレスバーは少ししか動かず、途中で止まってしまうことがあります。

13
firedev

私自身がこの問題を研究しているときに発見した多くのことの組み合わせです。 iOS5で適切に機能するコードは次のとおりです:(私は少し遅れていることはわかっていますが、答えは答えです。うまくいけば、将来的に人々を助けることができます)

<!DOCTYPE html>
<html>
<head>
<title>Hide Address Bar</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
 window.addEventListener("load",function() {
   setTimeout(function(){
    window.scrollTo(0, 0);
    }, 0);
 });
</script>
<style>
 body { min-height: 480px; }
</style>
</head>
<body>
 <h1>Content</h1>
</body>
</html>

出典: http://24ways.org/2011/raising-the-bar-on-mobile

例: http://jsbin.com/isenax/

29
Jon Dolan

コードはまだ機能するはずです。

とにかく、ここに全画面が必要であることをモバイルサファリに伝える正しい方法があります。 クリックしてください

例えば使用する

<meta name="Apple-mobile-web-app-capable" content="yes" />

[〜#〜]編集[〜#〜]

Appleは新しいmobile-uiプロパティを使用して、safariで最小限のUIを表示します。

プロパティ、minimal-uiがビューポートメタタグキーに追加され、ページの読み込み時にiPhoneの上部バーと下部バーを最小化できるようになりました。 minimal-uiを使用しているページで上部のバーをタップすると、バーが元に戻ります。コンテンツをもう一度タップすると、それらは再び閉じます。

次のように使用します。

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, minimal-ui" />

ソース: https://www.perpetual-beta.org/weblog/ios-7-dot-1-mobile-safari-minimal-ui.html

13
Gotschi

IOS7以降、window.scrollToトリックが機能しなくなりました。現在のところ、ユーザーにホーム画面にあなたのウェブサイトを追加するように勧める以外に回避策はありません。

http://www.mobilexweb.com/blog/safari-ios7-html5-problems-apis-review

iOS 7 Safariでアドレスバーを非表示にすることは可能ですか?

iPhone/iPod touch用のSafari iOS 7でナビゲーションバーを非表示にすることはできません

5
svassr

IOS 7では、minimal-uiメタタグを使用できます。残念ながら、それはiOS 8で削除されました。

IOS 8には、minimal-uiタイプの機能を復活させることになっているbrimというプロジェクトがあります。それはここにあります: https://github.com/gajus/brim

1
Clayton Gulick