这两天在做项目需求是一个webView加载一个从后台返回的富文本内容,但是会有一个问题,其中会有图片的宽度远远大于屏幕宽度,这样会导致只能看到一部分图片,左右去滑动webView查看全部内容肯定是不合适的,所以查找了一些资料在webView中注入下面一段js代码即可完美显示。当图片宽度大于一个你设定的宽度-DeviceWidth
,会去做屏幕适配正常显示,如果小于这个宽度直接展示,这个宽度一般设定为屏幕宽度,根据自己需求来即可。
-(void)webViewDidFinishLoad:(UIWebView *)webView {
NSString *script = [NSString stringWithFormat:
@"var script = document.createElement('script');"
"script.type = 'text/javascript';"
"script.text = \"function ResizeImages() { "
"var img;"
"var maxwidth=%f;"
"for(i=0;i <document.images.length;i++){"
"img = document.images[i];"
"if(img.width > maxwidth){"
"img.width = maxwidth;"
"}"
"}"
"}\";"
"document.getElementsByTagName('head')[0].appendChild(script);", DeviceWidth - 20];
[webView stringByEvaluatingJavaScriptFromString: script];
[webView stringByEvaluatingJavaScriptFromString:@"ResizeImages();"];
}