1

I have set "scalesPageToFit" property to YES for UIWebView. Its getting zoom , but when the page loading, the content is with tiny font which cannot be read without pinching. Can we set the zooming scale as default?

Bharathi
  • 485
  • 6
  • 16
  • What exactly I want is , When load the HTML content , it should be in 100 % zoom. When I pinch to zoom in it should zoom. – Bharathi Mar 22 '12 at 06:53
  • Did you tried the code I posted? Give it a shot – it will fix your problem! – dom Mar 23 '12 at 08:31
  • `scalesPageToFit = YES` it works but it change your default content size, [Look at my answer this will helpful for you.](http://stackoverflow.com/questions/7134576/enable-zooming-pinch-on-uiwebview/23971234#23971234) – iPatel Jul 22 '14 at 03:20

1 Answers1

3

This is more about the site you're loading then the UIWebView itself …

If you have controll over the displayed HTML just put <meta name="viewport" content="width=device-width;initial-scale=1.0"> inside your <head>.

If not: You can inject JavaScript into the UIWebView and execute it, so there is an easy way to insert the meta tag using a small code snippet:

NSString *result = [webView stringByEvaluatingJavaScriptFromString:
  [NSString stringWithFormat:@"var result = '';"
  "var viewport = null;"
  "var content = null;"
  "var document_head = document.getElementsByTagName( 'head' )[0];"
  "var child = document_head.firstChild;"
  "while ( child )"
  "{"
  " if ( null == viewport && child.nodeType == 1 && child.nodeName == 'META' && child.getAttribute( 'name' ) == 'viewport' )"
  "   {"
  "     viewport = child;"
  "     viewport.setAttribute( 'content' , 'width=device-width;initial-scale=1.0' );"
  "     result = 'fixed meta tag';"
  " }"
  " child = child.nextSibling;"
  "}"
  "if (null == viewport)"
  "{"
  " var meta = document.createElement( 'meta' );"
  " meta.setAttribute( 'name' , 'viewport' );"
  " meta.setAttribute( 'content' , 'width=device-width;initial-scale=1.0' );"
  " document_head.appendChild( meta );"
  " result = 'added meta tag';"
  "}"
  ]
];

Note, that the snippet will kill viewport settings made by the author of the HTML code … So you may get strange results.

dom
  • 11,894
  • 10
  • 51
  • 74
  • How about `var viewport = document.querySelector('head meta[name=viewport]')` instead of that pile of JS? – andytuba May 14 '14 at 16:09