# iOS小程序滚动穿透解析
## 什么是滚动穿透？
在开发iOS小程序时，常常会遇到“滚动穿透”这一问题。简单来说，当用户在某个视图（例如模态框或弹出层）中滚动时，如果该视图的滚动被正常处理，底层视图的滚动也会被触发。这种行为就被称为滚动穿透。
滚动穿透通常会导致用户体验不佳，例如，当用户想在弹出层中查看内容时，不小心滚动到了背景内容。为了提升用户体验，避免这种情况发生，我们需要采取一些措
hSwiper-wx小程序swiper组件使用此组件需要依赖小程序基础库 2.2.2 版本，同时依赖开发者工具的 npm 构建。具体详情可查阅官方 npm 文档。新版传送门，新版已经支持npm包安装旧版传送门，新版已经支持npm包安装演示水平垂直不循环功能支持水平，垂直滚动支持循环无缝滚动过渡位移效果支持自定义过渡位移时间支持自定义支持无限元素的滚动，而不会卡顿（未实现，待续...)安装npm i
转载
2023-11-04 06:37:58
76阅读
在iOS平台上开发微信小程序时，经常会遇到滚动穿透的问题。这一问题通常发生于页面嵌套了多个滚动元素（例如，滚动视图和列表组件）时，导致用户在某些情况下无法正常滚动或事件传递出现异常。这不仅影响用户体验，同时也影响了小程序的功能性，使得开发者需要深入分析并解决这一问题。
### 问题背景
在移动设备上，用户往往会在多个场景下使用小程序，例如：
- **场景一**：用户在浏览商品时，滑动商品列表
最近在学习微信小程序，所以把一些重点给记录下来 废话不多说，先来一波效果图： gif动图太小了 这边再来几张图片 重点说明 本接口数据来源于玩Android开放api 地址：https://www.wanandroid.com/ 详细功能介绍： 上边是一个可滑动的横向分类栏 下面是点击分类栏切换到的界面以及下边可滑动改变当前页面数据，以及数据在请求数据时加载时间过长，所以将已加载过的数据进行本地化
转载
2024-01-05 14:39:09
82阅读
微信小程序中使用map组件，ios手机中点击地图上的view，会触发底下的markertap，只要底下如果有marker点的话。这就造成了用户体验不是很好。然后无意间我发现点击能滑动的scroll-view反而不会触发底下的markertap，就等于是一个不穿透的容器。我就在想是不是view也可以换成scroll-view，然后防止穿透点击，答案是：可以。但是体验还是不太好，因为scroll-vi
转载
2024-01-13 06:56:05
700阅读
一 什么是上拉触底上拉触底是移动端的专有名词，通过手指在屏幕上的上拉滑动操作，从而加载更多数据的行为。二 监听页面的上拉触底事件在页面的 .js 文件中，通过 onReachBottom() 函数即可监听当前页面的上拉触底事件。示例代码如下。/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
console.log('触发了上拉触底的事件
上周有几天是在写一个响应式网站,在写到移动端交互时.遇到一个问题,就是点击下拉框的选项时,下拉框背后的元素也被点击了.其实这个就是著名的点击穿透现象,因此趁着周末的时间把这个问题梳理了一下.然后呢,也是参考了一些文章之后整理了这篇总结,也算是自己对这个问题的一个记录吧.300ms延迟延迟产生原因300ms 延迟的由来,是当初07年初苹果发布首款iPhone之前,苹果工程师提出的一个为了优化交互体验
安卓的webview和自带浏览器下有个奇怪的现象。现象：1、如果输入框input或者textarea的正上方（z轴方向，即上层）有个div，当点击这个div使得div隐藏了之后，input会得到焦点，导致软键盘弹出。2、浏览视图点击某个地方切换到编辑视图，如果浏览视图点击的位置 在 编辑视图相应位置有个输入框，那么切换过去之后，编辑页的输入框会自动得到焦点。这个体验很不舒服。讨论：这个不是点击事件
两种分页方式普通的分页效果会在页面底部提供点击下一页和上一页的按钮，在点击了按钮之后才会触发调取数据的接口，这种方式的用户体验一般另一种分页效果不需要用户点击按钮，只要浏览到当前页面的后几条数据时，系统会自动发送请求获取后一页的数据，并展示到页面上，这样就可以实现类似无限滚动的效果以csdn为例，当滚动条到达这个地方时，会自动调用请求下一页数据的接口，然后累加到加载完成的数据列表中实现思路滚动分页
转载
2024-02-02 18:25:11
65阅读
滚动穿透问题 在做商城类项目时通常都会有商品分类这一项，而大部分的商品分类是由tab分页栏或下拉菜单实现的，咱家此次遇到的问题便是下拉菜单滚动滚动穿透问题。首先声明下定义滚动穿透：在页面本身具有滚动条且页面中含有可滚动元素的前提下，将可滚动元素的X或Y轴滚动到极限后若继续滑动将带动整体页面沿同方向滚动。如下图：&n
转载
2023-10-10 11:14:02
327阅读
以前做 Android 的时候觉得 Android 适配好烦人，各种厂商，各种版本，各种机型都需要做适配，烦的一笔。现在做 H5 了，也还是要面对适配的问题，不过现在是反过来了，写好的代码在 Android 上跑的好好的，但是到了 IOS 上可能会出现各种问题，现在做适配基本都是针对 iOS 来做的了。 IOS 上要做的适配有很多，比如 1px ，图片，fixed布局，点击延迟，滚动穿透等等，各种
转载
2023-07-15 14:39:38
623阅读
小程序iOS滚动回弹问题是很多开发者在实际应用中经常面对的一道难题。在本文中，我将分享解决这一问题的过程，并逐步引导你完成从环境配置到进阶指南的各个步骤。
首先，你需要设置一个适合开发的小程序环境。下面这幅流程图说明了整个设置过程：
```mermaid
flowchart TD
A[开始] --> B{选择开发工具}
B --> C[安装Node.js]
C -->
微信小程序页面加载更多数据其实也不是很难，官方很好的给出了相应的组件和使用方法。只是需要在实际的开发中注意一下相关的问题点1：需要使用到的组件和APIscroll-view基础库 1.0.0 开始支持，低版本需做兼容处理。可滚动视图区域。使用竖向滚动时，需要给scroll-view一个固定高度，通过 WXSS 设置 height。组件属性的长度单位默认为px，2.4.0起支持传入单位(rpx/px
转载
2024-01-16 14:33:24
46阅读
# iOS滚动区域穿透：概念及实现
在我们开发iOS应用时，常常会遇到一个问题——如何处理滚动区域穿透。这通常发生在有嵌套滚动视图的情况下，比如在一个UIScrollView中嵌套了另一个UIScrollView。当我们尝试滚动内部的UIScrollView时，外部UIScrollView也可能会响应触摸事件，这种现象被称为“滚动区域穿透”。
本文将详细探讨这一问题，并提供解决方案及相关代码示
# 如何实现iOS弹窗滚动穿透
## 1. 整体流程
以下是实现iOS弹窗滚动穿透的步骤：
| 步骤 | 操作 |
| --- | --- |
| 1 | 创建一个自定义弹窗视图 |
| 2 | 将弹窗视图加载到主视图上 |
| 3 | 禁止弹窗视图的滚动事件被底层视图截获 |
| 4 | 使底层视图依然可以滚动 |
## 2. 操作步骤及代码实现
### 步骤1：创建一个自定义弹窗视图
原创
2024-03-28 07:35:17
88阅读
# 如何实现 JS 中的 iOS 滚动穿透
在开发移动端应用时，特别是在 iOS 系统上，可能会遇到一个常见问题：当你在某个弹出框内滚动内容时，背景的滚动也会穿透到下面的内容。这种现象被称为“滚动穿透”。为了优化用户体验，我们需要实现滞止背景滚动的效果。
本篇文章将详细介绍如何在 JavaScript 中实现 iOS 滚动穿透的解决方案。文章包括了整体流程、每一步操作的详细代码以及必要的注释，
源码https://github.com/chemalarrea/Android-wheel效果图代码实现:wheelScroller基本实现过程:UML结构图源码分析滚动的实体滚轮中间滚动的内容是？ LinearLayout WheelView.itemsLayout 该布局中的子View就是我们所要滚动选择的内容滚动的原理在滑动过程中，根据每次onTouchEvent回调来的Y坐标差值de
在iOS开发中，"滚动穿透"的现象常常使得用户体验大打折扣。这种情况通常出现在使用CSS和JavaScript实现页面交互时，尤其是在模态层或浮层上进行滚动时。目标是确保用户在滚动这些层时不会不小心触发背景页面的滚动操作。
### 问题背景
移动端用户在访问应用中的对话框或弹出层时，常常需要在其中进行滚动操作。当用户在模态框内纵向滚动时，背景页面可能会跟随滚动，这导致用户体验不佳。
引用描述：
## iOS 防止滚动穿透
在 iOS 开发中，特别是在实现模态视图（Modal View）或弹出层（Popover）时，我们常常会遇到“滚动穿透”这一问题。滚动穿透的意思是，用户虽然在一个模态视图上进行滚动，但其下方的内容仍然能够接收到滚动事件，从而导致用户的体验不连贯。这不仅会影响用户的使用感受，还可能导致数据的误操作。
### 为什么会发生滚动穿透？
在 iOS 中，`UIScroll
# UniApp iOS 滚动穿透实现指南
在开发移动应用时，特别是在 iOS 环境下，常常会遇到“滚动穿透”的需求。滚动穿透意味着在一个滚动元素（如弹出层、模态框等）上进行滚动时，能够滚动到背后的内容。Imagine this situation: you have a modal that you want to show content above the background. When
