よく忘れるのでMEMO
スマホサイト制作においてブラウザのアドレスバーを非表示にする。
<script type="text/javascript">
function hideAdBar(){ setTimeout("scrollTo(0,1)", 100);}
</script>
</head>
<body onLoad="hideAdBar()" onOrientationChange="hideAdBar()">
あとスマホ横向きの制御は幅479pxで行う。
480px（iPhone3.5インチ）では、大柄になって馬鹿っぽいくなるので。
iPadは、横にした際に、780pxで制御がちょうど良い？
横にした際に、両端に空スペースができる方が縦表示部分が大きくなるので…。
−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
アイコン設定
ホームのショートカットに表示されるアイコンの作成について見ていこう。画像のサイズは正方形で作成する。iPhoneの場合、過去の端末であるiPhone 3G /3GSは57×57px、Retinaディスプレイを搭載したiPhone 4/4Sは114×114pxとなっている。
<link rel="apple-touch-icon" href="img/apple-touch-icon.png" />
apple-touch-iconを指定した場合、iPhoneではアイコン画像に自動的に光沢処理が行われる。光沢をつけたくない場合は、rel属性の値にapple-touchiconではなく、apple-touch-iconprecomposedを指定
<link rel="apple-touch-icon-iconprecomposed" href="img/apple-touch.png" />
【参考】
https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW3
コメント