有的网页中会使用"<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">"这个标签来设置网页的宽度,不过带来的问题是,如果展示这个webview的宽度不等于设备的宽度的时候,就会出现网页内容过宽左右可以滑动或者网页左右内容没有占满。找了一下,有两个解决方法:

1. 利用webview中的scrollview的zoom特性,这个方法会让网页内容变小

- (void)webViewDidFinishLoad:(UIWebView *)theWebView
{
CGSize contentSize = theWebView.scrollView.contentSize;
CGSize viewSize = self.view.bounds.size; float rw = viewSize.width / contentSize.width; theWebView.scrollView.minimumZoomScale = rw;
theWebView.scrollView.maximumZoomScale = rw;
theWebView.scrollView.zoomScale = rw;
}

2. 第二个方法,在客户端使用js重写meta标签,这个也是在webview的delegate的webViewDidFinished回调中调用;我们使用的这种方法来操作,内容不会变小

javascript = [NSString stringWithFormat:@"var viewPortTag=document.createElement('meta');  \
viewPortTag.id='viewport'; \
viewPortTag.name = 'viewport'; \
viewPortTag.content = 'width=%d; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;'; \
document.getElementsByTagName('head')[0].appendChild(viewPortTag);" , (int)authWebView.bounds.size.width]; [authWebView stringByEvaluatingJavaScriptFromString:javascript];

参考:

1. http://stackoverflow.com/questions/10666484/html-content-fit-in-uiwebview-without-zooming-out

2. http://stackoverflow.com/questions/5594447/webpage-in-uiwebview-doesnt-autoresize-correctly-when-uiwebviews-width-is-less

3:http://m.blog.csdn.NET/blog/lihei12345/43565859

iOS中UIWebview中网页宽度自适应的问题的更多相关文章

  1. IOS的UIWebView中JS点击事件,需要加入cursor:pointer;属性才可以

    IOS的UIWebView中JS点击事件,需要加入cursor:pointer;属性才可以. Android的WebView可以支持外链样式,js文件:IOS则需要改为内嵌样式和JS文件.

  2. 【接上一篇】winform中dataGridView高度和宽度自适应填充完数据的高度和宽度,即dataGridView根据数据自适应大小

    上一篇:winform中dataGridView高度自适应填充完数据的高度 winform中dataGridView高度自适应填充完数据的高度,就是dataGridView自身不产生滚动条,自己的高度 ...

  3. ios中UIWebview中加载本地文件

    [super viewDidLoad]; webview=[[UIWebView alloc] initWithFrame:self.view.bounds]; [self.view addSubvi ...

  4. 使PC端网页宽度自适应手机屏幕大小

    有时候我们会纠结PC页面在手机页面上无法正常显示,超出屏幕,有些内容看不到,现在又了下面的代码,可以做到自适应手机端的屏幕宽度: 在html的<head>中增加一个meta标签: < ...

  5. IOS UIWebView截获html并修改便签内容,宽度自适应

    需求:混合应用UIWebView打开html后,UIWebView有左右滚动条,要去掉左右滚动效果:  方法:通过js截获UIWebView中的html,然后修改html标签内容:  实例代码:  服 ...

  6. iOS UIWebView中javascript与Objective-C交互、获取摄像头

    UIWebView是iOS开发中常用的一个视图控件,多数情况下,它被用来显示HTML格式的内容. 支持的文档格式 除了HTML以外,UIWebView还支持iWork, Office等文档格式: Ex ...

  7. iOS中UIWebView执行JS代码(UIWebView)

    iOS中UIWebView执行JS代码(UIWebView) 有时候iOS开发过程中使用 UIWebView 经常需要加载网页,但是网页中有很多明显的标记让人一眼就能看出来是加载的网页,而我们又不想被 ...

  8. Css中实现一个盒子固定宽度,另一个盒子宽度自适应的方法

    Css中实现一个盒子固定宽度,另一个盒子宽度自适应的方法 网上方法很多,个人认为以下两种思想是最为常用的. 一种是让第一个盒子脱离文档流,第二个盒子离左边有一定距离. 第二种方法是使用flex布局,不 ...

  9. iOS 中UIWebView的cookie

    有关cookie是什么,大家可以自行百度,本文我获得cookie的目的是得到一个userID. 下面的是代码. - (void)getUserIDFromCookie { NSHTTPCookieSt ...

随机推荐

  1. p1919 A*B Problem升级版

    传送门 题目 给出两个n位10进制整数x和y,你需要计算x*y. 输入格式: 第一行一个正整数n. 第二行描述一个位数为n的正整数x. 第三行描述一个位数为n的正整数y. 输出格式: 输出一行,即x* ...

  2. webAPI中使用log4net进行日志记录

    1.从nuget下载log4net 2.根据需求配置web.config,或者另外写一个log4net.config文件,各个节点的意义详细查询api <section name="l ...

  3. XLua 基础

    一.Lua文件加载 1.Resources文件夹下加载  xxx.lua.txt  文件 1.)Resources加载xuaTest文件 // 1.Resources加载xuaTest文件 TextA ...

  4. Eclipse 整合SpringMybatis,SpringMVC,用Maven管理项目搭建详情

    环境:JDK下载地址 https://pan.baidu.com/s/1UyvEAI-4Ci6TDdVJiYUUiQ 密码:ma51 IDE:eclipse下载地址 https://pan.baidu ...

  5. Spark 中的 RPC 的几个类

    Spark 中 RPC 部分的涉及了几个类,有点晕,在此记录一下 1. RpcEndpoint: RPC的一个端点.给定了相应消息的触发函数.保证  `onStart`, `receive` and ...

  6. 洛谷P3966 [TJOI2013]单词(后缀自动机)

    传送门 统计单词出现次数……为啥大家都是写AC自动机的嘞……明明后缀自动机也能做的说…… 统计出现次数这个就直接按长度排序然后做个dp就好,这是SAM的板子的要求啊,不提了 然后考虑怎么让所有串之间隔 ...

  7. Stream流、方法引用

    Stream流.方法引用 Stream流.方法引用 Stream流.方法引用 Stream流.方法引用 Stream流.方法引用 ... ...

  8. SCOJ4427 / TOPOI 4404: Miss Zhao's Graph 解题报告

    题目链接 SCOJ TOPOI 题目描述 Problem 给定一个包含n个顶点m条边的带权有向图,找一条边数最多的路径,且路径上的边的权值严格递增.图中可能有重边和自环. Input Data 第一行 ...

  9. iOS ksyhttpcache音视频缓存

    pod 'ksyhttpcache' 桥接文件 引入 #import <KSYHTTPCache/KSYHTTPProxyService.h> 带appdelegate里初始化 KSYHT ...

  10. Sharepoint JSCOM 列表操作

    SP.SOD.executeFunc('sp.js', 'SP.ClientContext', retrieveListItemsInclude); //确保js文件加载,再执行方法 function ...