zoukankan      html  css  js  c++  java
  • 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;
         100%;
        height: 100%;
        overflow: hidden;
    }
    body{
        position: fixed;
        top: 0;
        left: 0;
         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时,通知父窗体删除二维码。(具体没有尝试过)

    豌豆资源搜索网站https://55wd.com 广州vi设计公司http://www.maiqicn.com

  • 相关阅读:
    Linux-线程同步(day14续)
    Linux之线程(day14)
    Linux-网络编程-UDP网络编程(day13续2)
    ES6 模块加载
    let与var声明区别
    vue 常用指令v-if v-else v-show v-for
    动态路由的意义,以及路由重定向
    前端路由的理解
    socpe 与 包的引入
    VUE 组件注册(全局、局部)
  • 原文地址:https://www.cnblogs.com/xiaonian8/p/13740189.html
Copyright © 2011-2022 走看看