現在WEBViewアプリを作成しております。
そのwebサイトは横幅320px固定でサイトを作成しております。
metaタグには下記を指定しております。
html
1<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
webビュー呼び出し部分。
Objective
1 // デリゲート 2 self.webView.delegate = self; 3 4 // URLを指定 5 NSURL *url = [NSURL URLWithString:@"https://hogehoge.com"]; 6 NSURLRequest *request = [NSURLRequest requestWithURL:url]; 7 8 self.webView.scalesPageToFit = YES; 9 10 // リクエストを投げる 11 [self.webView loadRequest:request]; 12
で設定しているのですが、
実行してみるとiPhone6,6+ではサイトが320pxで表示され右側に白い余白が出て表示されてしまいます。
下記の方法で読み込む度にviewportのmetaタグを変更すれば、
iPhone6,6+でも余白が出来ず320が拡大されてピッタリ表示されるのですが、
この方法だと読み込む度に描画されるため小さくなってから大きく拡大されて表示されてしまいます。
javascript
1 var meta = document.createElement('meta'); 2 var iniScale = screen.width / 320; 3 meta.setAttribute('name', 'viewport'); 4 meta.setAttribute('content','width=device-width, initial-scale=' + iniScale + ', minimum-scale=0.5, maximum-scale=3.0, user-scalable=0'); 5 document.getElementsByTagName('head')[0].appendChild(meta);
iPhone6,6+でもピッタリ表示させられるようになる良い方法をご存知の方ご教授いただけないでしょうか。
あなたの回答
tips
プレビュー