How can I enable zoom in on UIWebView which inside the UIScrollView?
You MUST set scalesPageToFit=YES for any pinching and zooming to work on a UIWebView
OK, you need to do both the above, but also the following. I had a web view in the main view, and that didn't work.
- As above, you first have to put a UIScrollView in the main view, then put the web view in the scroll view.
- As above, implement
<UIScrollViewDelegate>in your view controller, drag the scroll view delegate to the view controller in Interface Builder, and implement theviewForZoomingInScrollViewmethod. This must return the pointer to the UIScrollView (return myScrollView). - I created IBOutlet properties for both the web view and the scroll view - link them in the NIB to your view controller.
- On the Scroll View, go to the Attributes Inspector, set your Max and Min zoom factors (I set 0.5 to 5.0, that works well).
- On the Web View, in the Attributes Inspector:
- In the Web View section, select Scales Pages To Fit
- In the View section, select for Mode, "Top Left"
- In the View section at the bottom, check off User Interaction Enabled, and Multiple Touch Enabled
With JavaScript you can control the zoom level, although the oly solution I have found doesn't look smooth.
Say you have in <head>:
<meta id="vp" name="viewport" content="width=768,initial-scale=1.0">To zoom to 4x, and still allow the user to change zoom, change the content twice:
var vp = document.getElementById('vp');vp.content = "width=767,minimum-scale=4.0,maximum-scale=4.0,user-scalable=yes";vp.content = "width=768,minimum-scale=0.25,maximum-scale=10.0,user-scalable=yes";Toggling the width is very important - otherwise Mobile Safari has serious repainting bugs (due to over-optimisation).
You cannot just set initial-scale again - it is ignored the second time.