How to resize image in UIWebview?

Question

I load a html file in UIWebview.I am trying to resize image in UIWebview didfinish Loading.In this webview, based on device size the html content split to number of pages(Below code show). For the pagination I used swipe gesture.It works properly till this.In this html file i have few images which vary in size from one another. Some images are more than the device width.I need to fix the width of the image so that it fits in the screen .I dont want to scrollable webview beacuse i used swipe gesture for pagination. So how can I re-size that images based on the device width.

I use following code

- (void)webViewDidFinishLoad:(UIWebView *)webView
{


     NSString *varMySheet = @"var mySheet = document.styleSheets[0];";

     NSString *addCSSRule =  @"function addCSSRule(selector, newRule) {"
     "if (mySheet.addRule) {"
     "mySheet.addRule(selector, newRule);"                              // For Internet Explorer
     "} else {"
     "ruleIndex = mySheet.cssRules.length;"
     "mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex);"   // For Firefox, Chrome, etc.
     "}"
     "}";

     NSString *insertRule1 = [NSString stringWithFormat:@"addCSSRule('html', 'padding: 0px; height: %fpx; -webkit-column-gap: 0px; -webkit-column-width: %fpx;')", webview4epub.frame.size.height, webview4epub.frame.size.width];
     NSString *insertRule2 = [NSString stringWithFormat:@"addCSSRule('p', 'text-align: justify;')"];

     [webview4epub stringByEvaluatingJavaScriptFromString:varMySheet];
     [webview4epub stringByEvaluatingJavaScriptFromString:addCSSRule];
     [webview4epub stringByEvaluatingJavaScriptFromString:insertRule1];
     [webview4epub stringByEvaluatingJavaScriptFromString:insertRule2];
     NSString* foundHits = [webview4epub stringByEvaluatingJavaScriptFromString:@"results"];
     NSMutableArray* objects = [[NSMutableArray alloc] init];

     NSArray* stringObjects = [foundHits componentsSeparatedByString:@";"];
     for(int i=0; i<[stringObjects count]; i++){
         NSArray* strObj = [[stringObjects objectAtIndex:i] componentsSeparatedByString:@","];
         if([strObj count]==3){
             [objects addObject:strObj];   
            }
        }


    int totalWidth = [[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.scrollWidth"] intValue];

}

Yedy Yedy · Accepted Answer · 2014-02-21T11:17:16

This sizes the first image to 90% of webViews height:

 NSString *imgHeightJSString = [[NSString alloc] initWithFormat:@"document.getElementsByTagName('img')[0].style.maxHeight = '%fpx'", webView.bounds.size.height*0.90];
[webView stringByEvaluatingJavaScriptFromString:imgHeightJSString];

This to 90% imageSize no matter what view.size:

 [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName('img')[0].style.maxHeight = '90%%'"] ;

For setting the widht just use maxWidth instead of maxHeight.

How to resize image in UIWebview?

1 Answers