UIWebView - scaling an image regardless of text

Question

I would like diplay HTML in iPhone UIWebView. My HTML looks like

text
text
<img src.../>
text
text

How can I make a component (using JavaScript or Objective-C) fit the image to the window - the text size will remain the same, but the image will be reduced / enlarged proportionally to prevent horizontal scrolling?

thank

Answer 1

You need to know what HTML looks like, because the only way to do this is to manipulate the DOM.

On Mac, you can access the DOM through Objective-C, but this API is not available on iPhone. Fortunately, you can do the same with the UIWebView javascript bridge.

, HTML :

text
text
<img id="myimage" src="..." height="150" width="150"/>
text
text

JS-, , HTML:

<script>
function enlargeImage(w, h)
{
   var img = document.getElementById("myimage");
   img.width = w;
   img.height = h;
}
</script>

- :

[webView stringByEvaluatingJavaScriptFromString:@"enlargeImage(300, 300)"];  

, HTML, webViewDidFinishLoad.

, , :

[webView stringByEvaluatingJavaScriptFromString:
    @"document.getElementById("myimage").width = 300;"];
[webView stringByEvaluatingJavaScriptFromString:
    @"document.getElementById("myimage").height = 300;"];

Answer 2

ems CSS. , ems. jpeg .

.