zoukankan      html  css  js  c++  java
  • 解决iOS与pad里ifram无法滑动问题


    今天遇到一个问题,在手机内嵌ifram,在iOS和pad里只会显示第一屏的内容,下面的内容加载出来了但是全部在下面,无法滑动展示,
    所以特意找了一下方法(经测可用)


    在iframe的父容器添加如下css样式:

    -webkit-overflow-scrolling:touch;
    overflow:auto;

    对于安卓低于4.0版本的浏览器不支持overflow的问题,可使用如下js解决(对uc无效):

        
    function touchScroll(id) {
                    var el = document.getElementByIdx_x(id);
                    var scrollStartPos = 0;
                    document.getElementByIdx_x(id).addEventListener("touchstart", function (event) {
                        scrollStartPos = this.scrollTop + event.touches[0].pageY;
                        event.preventDefault();
                    }, false);
                    document.getElementByIdx_x(id).addEventListener("touchmove", function (event) {
                        this.scrollTop = scrollStartPos - event.touches[0].pageY;
                        event.preventDefault();
                    }, false);
            }
  • 相关阅读:
    jquery ajax
    js 列表选择
    Jquery 搜索框自动提示
    图片居中跟inline-block
    模式学习(一)
    高效图形(一)
    eval() / Function()
    css3(一)
    回调函数(二)
    回调函数(一)
  • 原文地址:https://www.cnblogs.com/liyuanqing/p/7080725.html
Copyright © 2011-2022 走看看