ios webview中关于宽高的总结
测试一
测试的物料：
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=0.5 user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>SMAdUnit</title>
</head>
<body style="margin:0px auto; padding:0; overflow:hidden; background-color:transparent;"><p>
<a href="http://appsrv1.madserving.com/cli2/lgkrp9de65881hl5rl30066fjiv46q6881bqupb25bee2ec..MzY5MDQxMg.c46ab76d2859.ODY2Mjc4MDE..ODY2Mjc4MDEzNjkwNDEy...-1-1hlx5d/napi1.0.0000/90042385"><img src="http://ws-cdn.tangmobile.com/2009/smartmad2/20/52/25bee2ec.jpg" /></a></p>
</body>
<script type="text/javascript">
function loadimagefinish(){
console.log('document.body.clientWidth ' + document.body.clientWidth);
console.log('document.body.clientHeight ' + document.body.clientHeight);
console.log('window.screen.height ' + window.screen.height);
console.log('window.screen.width ' + window.screen.width);
console.log('window.screen.availHeight ' + window.screen.availHeight);
console.log('window.screen.availWidth ' + window.screen.availWidth);
console.log('window.innerWidth ' + window.innerWidth);
console.log('window.innerHeight ' + window.innerHeight);
console.log('window.outerWidth ' + window.outerWidth);
console.log('window.outerHeight ' + window.outerHeight);
console.log('window.screenLeft ' + window.screenLeft);
console.log('window.screenTop ' + window.screenTop);
console.log('window.screenY ' + window.screenY);
console.log('window.screenX ' + window.screenX);
}
var timerid = window.setInterval(loadimagefinish,5000);
</script>
</html>
webview 设置为300*280
测试设备 iPad
这是使用safair调试截图：
测试二
测试的物料：
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>SMAdUnit</title>
</head>
<body style="margin:0px auto; padding:0; overflow:hidden; background-color:transparent;"><p>
<a href="http://appsrv1.madserving.com/cli2/lgkrp9de65881hl5rl30066fjiv46q6881bqupb25bee2ec..MzY5MDQxMg.c46ab76d2859.ODY2Mjc4MDE..ODY2Mjc4MDEzNjkwNDEy...-1-1hlx5d/napi1.0.0000/90042385"><img src="http://ws-cdn.tangmobile.com/2009/smartmad2/20/52/25bee2ec.jpg" /></a></p>
</body>
<script type="text/javascript">
function loadimagefinish(){
console.log('document.body.clientWidth ' + document.body.clientWidth);
console.log('document.body.clientHeight ' + document.body.clientHeight);
console.log('window.screen.height ' + window.screen.height);
console.log('window.screen.width ' + window.screen.width);
console.log('window.screen.availHeight ' + window.screen.availHeight);
console.log('window.screen.availWidth ' + window.screen.availWidth);
console.log('window.innerWidth ' + window.innerWidth);
console.log('window.innerHeight ' + window.innerHeight);
console.log('window.outerWidth ' + window.outerWidth);
console.log('window.outerHeight ' + window.outerHeight);
console.log('window.screenLeft ' + window.screenLeft);
console.log('window.screenTop ' + window.screenTop);
console.log('window.screenY ' + window.screenY);
console.log('window.screenX ' + window.screenX);
}
var timerid = window.setInterval(loadimagefinish,5000);
</script>
</html>
webview 设置为300*280
测试设备 iPad
这是使用safair调试截图：
比较两个物料发现
物料一
<meta name="viewport" content="initial-scale=0.5 user-scalable=no" />
物料二
<meta name="viewport" content="width=device-width, user-scalable=no">
个人认为：由于设置了viewport导致物料二中document.body.clientWidth 返回宽度是设备的宽度，document.body.clientHeight 高度按照300＊280的比例等比例放大了 280*（768/300）＝716.8（约等于717）
获取webview的实际宽度可以考虑使用window.innerWidth,window.innnerHeight.(资料现实这两个返回的值不包括边框宽度)
ios webview中关于宽高的总结的更多相关文章
- 【IE6的疯狂之一】IE6中奇数宽高的BUG
IE6真是太疯狂了.今天由于项目需要做了这么一个布局:一个外部的相对定位div,内部一个绝对定位的div(right:0), 如图: 可是在IE6下查看,却变成了right:1px的效果了: IE6还 ...
- canvas基础入门（一）canvas的width、height于css样式中的宽高区别
canvas的width.height于css样式中的宽高对画布的内容显示是有所区别的 1.在canvas标签下调用他的width和height,而且是没有单位的宽高,这种指定canvas大小的方法也 ...
- iOS硬解码获取宽高
1: CVPixelBufferGetWidth(_:The pixel buffer whose width you want to obtain) 获取解码后图像宽度 CVPixelBufferG ...
- js中各种宽高
各种宽高 Javascript: IE中:document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY ...
- DOM中获取宽高、位置总结
原生JS 一.文档.窗口的宽高和位置 // 获取屏幕的宽高 window.screen.height | window.screen.width // 屏幕可用工作区宽高 window.screen. ...
- 第76天：jQuery中的宽高
Window对象和document对象的区别 1.window对象表示浏览器中打开的窗口 2.window对象可以省略,比如alert()也可以写成window.alert() Document对象是 ...
- js/jQuery中的宽高
一.和window有关的宽高 window.innerWidth:浏览器窗口宽度 window.innerHeight:浏览器窗口高度(不包括导航,工具栏等的高度) window.outerWidth ...
- jquery操作html中图片宽高自适应
在网站制作中如果后台上传的图片不做宽高限制,在前台显示的时候,经常会出现图片变形,实用下面方法可以让图片根据宽高自适应,不论是长图片或者高图片都可以完美显示. $("#myTab0_Cont ...
- IE6中奇数宽高的BUG
一个外部的相对定位div,内部一个绝对定位的div(right:0), 如图: 可是在IE6下查看,却变成了right:1px的效果了: IE6还有奇数宽高的bug,解决方案就是将外部相对定位的div ...
随机推荐
- pagemap, from the userspace perspective
pagemap, from the userspace perspective --------------------------------------- pagemap is a new (as ...
- C#中文和UNICODE编码转换
C#中文和UNICODE编码转换 //中文轉為UNICODE string str = "中文"; string outStr = ""; if (!strin ...
- Android开发--ImageView的应用
1.简介 当要在屏幕上显示图片时,ImageView用于创建显示图片所需的对象.另外,通过设置ImageView可以改变图片的有关属性. 2.构建 使用Images & Media中的部件来实 ...
- mac xcworkspace xcodebuild
xcodebuild 在介绍xcodebuild之前,需要先弄清楚一些在XCode环境下的一些概念[4]: Workspace:简单来说,Workspace就是一个容器,在该容器中可以存放多个你创建的 ...
- HDU 1231:最大连续子序列 解题报告
第一次写博客, 自己总结写出了一道题感觉值得保存. 自己总结的规律:求最大连续子序列, 可以先求包括第N项在内的前N项最大值, (因为每一项都求过后, 前N项最大值最大的那一个元素所连续的序列即为最大 ...
- 自定义控件之 TextBox
//textbox typevar boxType = { WaterMarkBox: 0, ValidateBox: 1, SearchBox: 2}var textBoxObj = functio ...
- eval解析非标准json
以前一直在用,但是不知道原理,惭愧啊,今天把自己想法加上. eval("{a:1}"); eval("{a:,b:1}"); 第一眼的感觉是都会得到一个对象,其 ...
- css中的display以及position属性
我们都知道,元素分为行内元素和块级元素,在页面布局中,我们常常需要让行内元素具有块级元素的特性,或者使块级元素转换成行内元素,这就要使用我们的display属性了. 我们先定义三个div: 以上的三个 ...
- C#实现微信公众号群发消息（解决一天只能发一次的限制）
经过几天研究网上的代码和谢灿大神的帮忙,今天终于用C#实现了微信公众号群发消息,现在整理一下. 总体思路:1.首先必须要在微信公众平台上申请一个公众号. 2.然后进行模拟登陆.(由于我对http传输原 ...
- Mousejack Hacking : 如何利用MouseJack进行物理攻击
0×00 前言 近期安全公司Bastille Networks(巴士底狱)安全研究员发现大多数无线鼠标和接收器之间的通信信号是不加密的.黑客可对一百米范围内存在漏洞的蓝牙无线键鼠进行嗅探甚至劫持,从而 ...