• 阻止iOS中页面弹性回滚,只允许div.phone_body的区块有弹性


    使用说明:只要替换选择器:var selector = '.phone_body';

    /**
         * 阻止iOS中页面弹性回滚,只允许div.scroller的区块有弹性
         */
    (function () {
    
        var selector = '.phone_body';
        var u = navigator.userAgent;
    
        if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机
            //alert("安卓手机");
        } else if (u.indexOf('iPhone') > -1) {//苹果手机
            //alert("苹果手机");
            //window.addEventListener("touchmove", handlePageBounce, false);
            //window.addEventListener("touchstart", handlePageBounce, false);
        } else if (u.indexOf('Windows Phone') > -1) {//winphone手机
            //alert("winphone手机");
        }
    
    
        //if ($.os.ios) {
        //    window.addEventListener("touchmove", handlePageBounce, false);
        //    window.addEventListener("touchstart", handlePageBounce, false);
        //}
        function handlePageBounce(evt) {
            if (evt.type === "touchstart") {
                this._startTouchY = evt.touches[0].screenY;
                return;
            }
            var panel = $(evt.target).closest(selector);
            if (panel.length === 0) return evt.preventDefault();
            var el = panel.get(0);
            var canScroll = el.scrollHeight > el.clientHeight;
            var hasTouchOverflow = $(el).computedStyle("-webkit-overflow-scrolling") === "touch";
            var hasOverflow = $(el).computedStyle("overflowY") !== "hidden";
            var height = parseInt($(el).computedStyle("height"), 10);
            if (canScroll && hasTouchOverflow && hasOverflow) {
                var currY = evt.touches[0].screenY;
                var scrollAtTop = ((this._startTouchY <= currY) && (el.scrollTop === 0));
                var scrollAtBottom = ((this._startTouchY >= currY) && ((el.scrollHeight - el.scrollTop) === height));
                if (scrollAtTop || scrollAtBottom)
                    evt.preventDefault();
            } else {
                evt.preventDefault();
            }
        }
    })();
    

      

  • 相关阅读:
    代理的原理
    nodemon:让node自动重启
    http与https的区别
    Content-Type:几种常用数据编码格式
    vue ssr服务端渲染
    vue 实现文件上传和文件下载
    vue element-ui表格里时间戳转换成时间显示
    vue npm start 自动打开网页
    yearProgress.vue
    vuejs中class与style的绑定
  • 原文地址:https://www.cnblogs.com/bwlluck/p/6026092.html
Copyright © 2020-2023  润新知