【体验优化】手机浏览器中下拉显示网址问题（主要是IOS下需要这样处理）

let isScroll = false,touchSX, //触摸开始的X坐标touchSY, //触摸开始的Y坐标touchEX, //触摸结束的X坐标touchEY, //触摸结束的Y坐标touchSEX, //一次触摸的X坐标差touchSEY; //一次触摸的Y坐标差
$("body").on('touchstart', ".event-phoneScroll", function (e) {let el = $(this)[0],touches = e.touches[0];touchSX = touches.pageX;touchSY = touches.pageY;if (el.scrollTop === 0 || (el.scrollTop + el.offsetHeight) === el.scrollHeight) {isScroll = false;}
}).on('touchmove', ".event-phoneScroll", function (e) {let el = $(this)[0],touches = e.touches[0];touchEX = touches.pageX;touchEY = touches.pageY;touchSEX = touchEX - touchSX;touchSEY = touchEY - touchSY;let slidingType = "";if (Math.abs(touchSEX) > 10 || Math.abs(touchSEY) > 10) {if (Math.abs(touchSEX) > Math.abs(touchSEY)) {if (touchSEX > 0) {slidingType = "right";} else {slidingType = "left";}isScroll = true;} else {if (touchSEY > 0) {slidingType = "down";} else {slidingType = "up";}if (el.scrollTop === 0 && (slidingType === "" || slidingType === "down")) {isScroll = false;} else if ((el.scrollTop + el.offsetHeight) === el.scrollHeight && (slidingType === "" || slidingType === "up")) {isScroll = false;} else {isScroll = true;}}}
});
document.body.addEventListener('touchmove', function (e) {if (!isScroll) {e.preventDefault();}
}, {passive: false});

【体验优化】手机浏览器中下拉显示网址问题（主要是IOS下需要这样处理）相关推荐

android 小工具：pc 上用 curl 命令打开手机浏览器，浏览指定网址
测试 API 时或其它情况经常需要在手机浏览器中输入 url 一长串的 url 输起来真是麻烦 AirDroid 很强大也不用数据线,但有时老断开连接,不是很爽.发到手机 qq 吧还得手动粘贴所以自 ...
vscode内置浏览器开发vue 显示网址
最近使用VS Code开发vue项目,需要经常在编辑器和浏览器之间来回切换查看页面效果,感觉特别繁琐!今天就来分享下如何在VS Code中实时预览HTML页面或VUE/React/Angular等页面 ...
手机安装pem_使用HTTP网址分发并安装iOS程序
背景最近要给远方的客人提供一个iOS App来进行预览体验,因为不是正式的产品,所以不能发布到苹果商店:又因为iOS不像Android那么开放,可以随随便便下载安装一个外部apk:又因为是远方的人员 ...
css表格中下拉菜单怎么设置,css如何实现下拉菜单？css实现下拉菜单的方法（完整代码）...
本篇文章给大家带来的内容是关于css如何实现下拉菜单?css实现下拉菜单的方法(完整代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. /*盒子,相对定位*/ .dropdown{ ...
uniapp+uView1.0做H5应用的时候，ios系统右侧会显示滚动条，如何隐藏ios下的滚动条
跟目录下的App.vue文件,不能全局写css样式,因为,安卓下会有问题,所以用js动态加载css代码片段的方式直接上代码 let platform=uni.getSystemInfoSync(). ...
基于图像识别测试手机浏览器打开网页首屏时间的方法
本文涉及性能测试技术,特别是涉及一种基于图像识别的测试手机网页首屏时间的方法,它可以应用在手机浏览器页面加载响应时间的的自动化测试或性能检测中.同时可以应用到其他android的apk的响应时间的测试 ...
html手机打不开是什么,手机打不开路由器网址_手机打不开路由器设置页面怎么办？ - 192路由网...
问:手机打不开路由器设置页面怎么办? 我的问题是这样的,由于没有电脑,我就用手机来设置的路由器. 但是,我在手机浏览器中输入路由器的网址后,却打不开路由器的设置页面. 手机设置路由器的时候,怎样才能打 ...
android web连接问题,Android WebView或手机浏览器打开连接问题解决办法总结
Android WebView或手机浏览器打开连接问题解决办法总结 1.通常情况下大家可能都想使用WebView打开网页内部链接而不想再调用手机浏览器, 我们可以通过以下两种方法实现: (1)为We ...
iOS下border一半不显示问题
如图区域, 1.在做点击评价的时候,刚开始遇到下边选择标签左边border显示不全(仅在iOS下电脑和安卓显示完全正常), 解决方法:没有写宽高,使用padding将内容撑开,解决 2.又一次遇到问题 ...

【体验优化】手机浏览器中下拉显示网址问题（主要是IOS下需要这样处理）

【体验优化】手机浏览器中下拉显示网址问题（主要是IOS下需要这样处理）相关推荐

最新文章

热门文章