iframe在iphone手机上的问题
问题1:
通过document.addEventListener("scroll",function(){})对页面滚动监听事件进行监听,但ios下$(document).scrollTop()值始终为0,对页面监听无效。
原因:
因为iOS下iframe的高度会根据页面的内容自适应,造成了iframe的高度过高(即iframe的高度>屏幕的高度)。则iframe内部html、body标签即使设置为100%,它的值也是页面所有内容撑开的高度。
解决方法:
将body设置为fixed,宽高设为100%,添加-webkit-overflow-scrolling: touch;在body下写一个div,针对这个div进行scroll监听操作。
html{
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
body{
position: fixed;
top:;
left:;
width: 100%;
height: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
问题2:ios中点击,通过display=block或.show()显示元素会跳转顶部。
解决方法:将元素设置为visibility:hidden,通过改变值为"visible"显示元素。
问题3:ios微信中,iframe下长按二维码识别不了。
原因:iframe受微信的安全限制,阻止了默认事件,也可能是父子窗口的原因。
解决思路:看其他文章说可以在iframe中的二维码被按下touchstart的时候,将二维码地址推送至父页面。父页面接收到二维码识别的请求,则创建一个不可见的img元素,src为刚刚传输过来的二维码地址,并且二维码置顶铺满整个屏幕。在touchend与touchcancel时,通知父窗体删除二维码。(具体没有尝试过)
iframe在iphone手机上的问题的更多相关文章
- 在iPhone手机上写了input type="date" 显示不出来的原因
在iPhone手机上写了input type="date" 显示不出来的原因 今天在手机页面上使用新的input类型,这样子写,在chrome浏览器上浏览,很好,显示出来.然后用i ...
- 关于iphone手机上点击事件不起作用
今天调试手机端H5页面的时候,发现一个很坑的问题,绑定的点击事件不起效果,安卓上都没问题,事件能正确触发,但是在iPhone没反应. 开始觉得是写法问题,后来发现,是由于iPhone上,点击的对象,必 ...
- Jquery的$(document).click() 在iphone手机上失效的问题
click事件和 touchstart事件共存 安卓IOS手机都适用 $(document).on("click touchstart", ".demo", f ...
- 禁用iPhone手机浏览器上给电话号码自动加上的link样式
iPhone手机上的浏览器(如Safari),在解析网页的时候会自动给 像是电话号码的数字 加上link样式. 可以添加下面的meta禁用掉这个功能. // //
- 禁用iPhone手机浏览器上给电话号码自动加上的link样式(苹果手机自动给手机号加样式)
原文地址:http://blog.csdn.net/atec2000/article/details/44631633 iPhone手机上的浏览器(如Safari),在解析网页的时候会自动给 像是电话 ...
- iphone手机怎么录屏 两种方法任你挑选
iphone手机怎么录屏呢?苹果手机拥有独特的Airlay镜像投屏,AirPlay的工作原理是当iPhone或IPAD与支持AirPlay技术的硬件,比如Apple TV等设备处在同一个wife的情况 ...
- iPhone手机怎么投屏到电脑上
如今生活水平不断上升,人们更加追求高质量.高享受的生活,所以可以利用一切资源提高生活质量,享受更好的生活体验,比如说手机投屏电脑就可以提高我们的视觉体验,所以更多的人去尝试,那么iPhone手机怎么投 ...
- iPhone手机安全指南
摘要:iPhone手机安全指南 - 1.iPhone解锁使用指纹:2.启用“查找我的iPhone”功能:3.Apple ID启用两步验证:4.修改SIM卡PIN码.5.iPhone被盗或丢失后,登录i ...
- 苹果IPhone手机由于更新了IOS7 Beta测试版导致“激活出错”后,如何还原电话本和照片方法
苹果这狗日的,手段果然狠,因为用户提前升级了测试版又没有更新正式版,就突然把手机变砖头,既不让升级正式版,也不让备份手机中的信息,确实有必要这样吗? 我的手机是IPone4s,在看了6月Apple W ...
随机推荐
- 机器学习(ML)十四之凸优化
优化与深度学习 优化与估计 尽管优化方法可以最小化深度学习中的损失函数值,但本质上优化方法达到的目标与深度学习的目标并不相同. 优化方法目标:训练集损失函数值 深度学习目标:测试集损失函数值(泛化性) ...
- 入侵检测基本准则(Basic principles of intrusion detection)【v1.0】
所谓“入侵检测”,顾名思义,就是对入侵行为的发觉.他通过对计算机网络或计算机系统中若干关键点收集信息并对其进行分析,从中发现网络或系统中是否有违反安全策略的行为和被攻击的迹象.” 但实际上,所谓的“违 ...
- 数据算法 --hadoop/spark数据处理技巧 --(17.小文件问题 18.MapReuce的大容量缓存)
十七.小文件问题 十八.MR的大容量缓存 在MR中使用和读取大容量缓存,(也就是说,可能包括数十亿键值对,而无法放在一个商用服务器的内存中).本次提出的算法通用,可以在任何MR范式中使用.(eg:MR ...
- ps查看资源消耗
- Android Studio 找不到夜神模拟器的解决办法
Android Studio 找不到夜神模拟器的解决办法 1.启动夜神模拟器 2.找到你电脑上的夜神安装目录,在bin目录下打开cmd窗口,运行命令 nox_adb.exe connect 127.0 ...
- centos7利用系统镜像修复grub
1 故障描述 由于错误操作,导致grub配置文件失效,系统开机后一直卡在下面的画面. 2 解决办法 这时候,就要利用系统镜像光盘,进入修复模式,然后按下面图示操作 进入镜像的shell环境,如下图所示 ...
- centos系统重装python或yum 报There was a problem importing one of the Python modules required to run yum. The error leading to this problem was:错误
sudo vim /usr/bin/yum #修个python所在的路径,例如 #/usr/local/bin/python2.6 或 /usr/local/bin/python2.7要原本你的系统原 ...
- MyBatis 与Ibatis 区别
Ibatis 是 Mybatis 的前身,两者都是优秀的持久层框架. 区别: 1.mybatis 实现接口绑定,不需要具体接口实现类.但是需要在xml文件中 的 namespace 绑定具体的接口. ...
- CentOS6.5安装指定的PHP版本(php5.5)(转)
查询是否安装有php #rpm -qa|grep php 删除之前安装的php版本 (yum install 安装) #rpm -e php-fpm-5.3.3-47.el6.x86_64 --nod ...
- Windows远程连接Ubuntu上的MySQL数据库
原因:mysql安装好后,默认监听3306端口,并且只允许localhost访问,只允许root用户在localhost上登录. 我的环境: Ubuntu16.04 ...