スマートフォン用サイトでアドレスバーを隠す
2012.03.28
スマートフォン用のサイトでよくアドレスバーを隠す設定になっているところを多く見かけます。
ということで検索していろいろなページを参考にやってみました。
一画面で表示できる範囲がひろくなっていい感じです。
赤字部分が必須です。

---------------

<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, 
initial-scale=1, maximum-scale=1">
<title>スマートフォン用サイト</title>
<style type="text/css">
body {
  min-height: 416px;
  -webkit-text-size-adjust: none;
}
</style>
<script type="text/javascript">
window.onload = function(){
setTimeout("scrollTo(0,1)", 100);
}
</script>
</head>
<body>
サイトの中身
</body>
</html>

---------------

1点注意点が。
このアドレスバーを隠す設定をしている場合、
idを使ったアンカーリンクがきかなくなります。
ご注意を。
| コメント(0)

コメントする

※JavaScriptが有効になっている必要があります




月別アーカイブ