首页 > 代码库 > 阻止iOS中页面弹性回滚,只允许div.phone_body的区块有弹性
阻止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(); } } })();
阻止iOS中页面弹性回滚,只允许div.phone_body的区块有弹性
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。