解决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); }