方法一

处理HTMLString的方法:

  NSString *htmls = [NSString stringWithFormat:@"<html> \n"
"<head> \n"
"<style type=\"text/css\"> \n"
"body {font-size:15px;}\n"
"</style> \n"
"</head> \n"
"<body>"
"<script type='text/javascript'>"
"window.onload = function(){\n"
"var $img = document.getElementsByTagName('img');\n"
"for(var p in $img){\n"
" $img[p].style.width = '100%%';\n"
"$img[p].style.height ='auto'\n"
"}\n"
"}"
"</script>%@"
"</body>"
"</html>",htmlString];
 [self.webView loadHTMLString:htmlString baseURL:nil];

处理HTMLString的原理:

原理就是用一个for循环,拿到所有的图片,对每个图片都处理一次,让图片的宽为100%,就是按照屏幕宽度自适应;让图片的高atuo,自动适应。文字的字体大小,可以去改font-size:15px,这里我用的是15px。根据自己的具体需求去改吧。

方法二

[webView stringByEvaluatingJavaScriptFromString:

@"var script = document.createElement('script');"

"script.type = 'text/javascript';"

"script.text = \"function ResizeImages() { "

"var myimg,oldwidth;"

"var maxwidth=300;" //缩放系数  改变参数控制图片缩放大小

"for(i=0;i <document.images.length;i++){"

"myimg = document.images[i];"

"if(myimg.width > maxwidth){"

"oldwidth = myimg.width;"

"myimg.width = maxwidth;"

"myimg.height = myimg.height * (maxwidth/oldwidth);"

"}"

"}"

"}\";"

"document.getElementsByTagName('head')[0].appendChild(script);"];

[webView stringByEvaluatingJavaScriptFromString:@"ResizeImages();"];

方法三

- (void)webViewDidFinishLoad:(UIWebView *)webView {
  NSString *js = @"function imgAutoFit() { \
     var imgs = document.getElementsByTagName('img'); \
     for (var i = 0; i < imgs.length; ++i) {\
        var img = imgs[i];   \
        img.style.maxWidth = %f;   \
     } \
  }";
  js = [NSString stringWithFormat:js, [UIScreen mainScreen].bounds.size.width - 20];
  
  [webView stringByEvaluatingJavaScriptFromString:js];
  [webView stringByEvaluatingJavaScriptFromString:@"imgAutoFit()"];
}
我们这里获取了屏幕的宽度,然后设置成图片的最大宽度为屏幕的宽度-20。(此方法没有实践过,详情参考http://www.henishuo.com/webview-img-auto-fit/)

UIWebView加载html 图片大小自适应的方法汇总的更多相关文章

  1. WebView加载HTML图片大小自适应与文章自动换行

    http://www.brighttj.com/ios/ios-webview-load-html-image-adaptive.html 在很多App中都会使用到webview,尤其是在加载新闻内容 ...

  2. 【iOS】WebView加载HTML图片大小自适应与文章自动换行

    在很多App中都会使用到webview,尤其是在加载新闻内容等文章形式的数据时.因为图文混编以及不同字体格式的显示,在iOS进行编辑 和显示都是一大问题(当然,iOS中也可以用CoreText进行绘制 ...

  3. UIWebView中加载的网页尺寸太大,如何让网页适应屏幕大小 WebView加载HTML图片大小自适应与文章自动换行

    webview.scalesPageToFit = YES; http://www.cnblogs.com/yujidewu/p/5740934.html 若需要根据图片原本大小,宽度小于320px的 ...

  4. 用UIWebView加载本地图片和gif图

    加载gif图: NSData *gif = [NSData dataWithContentsOfFile: [[NSBundle mainBundle] pathForResource:@" ...

  5. UIWebView如何加载本地图片

    UIWebView如何加载本地图片 UIWebView加载本地图片是有实用价值的.比方说,有时候我们需要本地加载静态页来显示相关帮助信息,而这些帮助信息当中含有很多很多的富文本,用代码实现难度较大,这 ...

  6. oc加载动态图片

    NSString *name = @"qianming.gif"; NSString *filePath = [[NSBundle bundleWithPath:[[NSBundl ...

  7. Android ListView 图片异步加载和图片内存缓存

    开发Android应用经常需要处理图片的加载问题.因为图片一般都是存放在服务器端,需要联网去加载,而这又是一个比较耗时的过程,所以Android中都是通过开启一个异步线程去加载.为了增加用户体验,给用 ...

  8. Fresco 使用笔记(一):加载gif图片并播放

    项目总结 --------------------------------------------------------------------- 前言: 项目中图文混合使用的太多太多了,但是绝大部 ...

  9. 图片_ _Android有效解决加载大图片时内存溢出的问题 2

    Android有效解决加载大图片时内存溢出的问题 博客分类: Android Android游戏虚拟机算法JNI 尽量不要使用setImageBitmap或 setImageResource或 Bit ...

随机推荐

  1. img图片元素下多余空白解决方案

    在进行页面的DIV+CSS排版时,遇到IE6(当然有时Firefox下也会偶遇)浏览器中的图片元素img下出现多余空白的问题绝对是常见的对於 该问题的解决方法也是「见机行事」,根据原因的不同要用不同的 ...

  2. svg text文字居中

    <text x="100" y="100" text-anchor="middle" dominant-baseline=" ...

  3. 《CSS网站布局实录》学习笔记(六)

    第六章 CSS高级应用与技巧 6.1 id与class 6.1.1 什么是id id是XHTML元素的一个属性,用于标识对象名称.无论是class还是id,都是XHTML所支持的公共属性,并且也是其核 ...

  4. 如何在github上传自己的项目

    1.首先在github创建自己的账号. 2.下载github for windows 客户端 (备注:这里我的电脑是windows系统的) ,不要下载错了,网上下载的应该是这样的安装程序 3.安装gi ...

  5. telnet与tnsping

    在cmd 下面 tnsping ZCGL ZCGL这个是在oracle做好的数据库连接. telnet IP地址 加上端口号. 查看视图的编写语句 select dbms_metadata.get_d ...

  6. ORA-00214: controlfile '/u01/app/oracle/oradata/[sid]/control01.ctl' version inconsistent with file '/u01/app/oracle/oradata/[sid]/control03.ctl'

    Sample error: SQL> startupORACLE instance started. Total System Global Area 285212672 bytesFixed ...

  7. 手动安装svn到eclipse

    今天为了装个svn搞得我焦头烂额~ 1.下载site-1.10.10.zip.(http://download.csdn.net/download/codepython/9082533) 2.在ecl ...

  8. 武汉科技大学ACM :1001: 华科版C语言程序设计教程(第二版)课后习题3.12

    Problem Description 输入n,输出对应的边长为n的空心正六边形. 为方便看图,样例中点 '.' 表示空格,打印图形时请打印空格而非小圆点. Input 边长n.(n<=20) ...

  9. 逆天的IE7中,诡异的横向滚动条

    今天老邹我又要吐槽IE7了,这个奇葩浏览器总是不让省心.这回遇到的问题,灰常难发现是怎么回事,不过还是让我发现原因,哈哈,只要原因去干掉这个问题比躲避问题用别的办法绕开要爽的多啊. 首先我还是介绍下, ...

  10. 类似a:hover的伪类的注解

    a:link { font-size: 14pt; text-decoration: underline; color: blue; } /*设置a对象在未被访问前的样式表属性 .*/ a:hover ...