移动端h5页面不能滑动,模拟器可以下滑,问题的解决办法 您所在的位置:网站首页 电脑手机浏览器模拟器怎么用不了 移动端h5页面不能滑动,模拟器可以下滑,问题的解决办法

移动端h5页面不能滑动,模拟器可以下滑,问题的解决办法

2024-07-09 08:53| 来源: 网络整理| 查看: 265

我是今年才接触html,现在画页面经常也用frontpage辅助,最近粘贴了个页面后,发现没办法再手机上滚动,所以记录一下,也顺便记录下自己的生活。 昨天做了很多梦,从上海来这边一年了,诸多不顺,技术也是从后端到前端,因为小地方,后端基本用不上,基本都是短平快的h5,小程序,公众号,很少会想着构建统一的数据服务,什么数据中台就更扯淡了。 话不多说,结果导向,好好加油!

1、H5页面没有使用任何滚动插件,比如: iscroll.min.js 或者 Better Scroll。

这里是因为:

{ touch-action: none; } 这段代码,会导致安卓手机H5页面无法滚动,而苹果手机可以。 使用 iscroll.min.js 或者 Better Scroll 也没用。

2.也可能是CCS的设置,下面分先说css的问题,主要排查overflow:hidden;

检查也有一定的顺序,检查超出高度的标签是否用了overflow:hidden;最好先检查html或body是不是加了height:100%;overflow:hidden;然后再看包裹在最外边的元素是否加了overflow:hidden;

2.js,js也可能影响,主要是一些掉默认事件

主要是有在touchstart、touchmove或touchend等事件中的阻止默认事件的原因

例如:$("#myCarousel").on(“touchstart”, function (e) {

e.preventDefault(); startX = e.originalEvent.changedTouches[0].pageX, startY = e.originalEvent.changedTouches[0].pageY; });

这种代码其中e.preventDefault();会阻止掉默认的滚动行为。

转载于:https://www.cnblogs.com/vickya/p/8572221.html



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有