方案说明：方案1：整个页面滚动，滚动至某个位置fixed图中“顶部box2”,分页页面触底加载方案2：页面高度为屏幕高度，商品部分使用scroll-view，scroll-view初始高度为屏幕高度-顶部高度，只滚动scroll-view。 思路说明： 1 将整个页面分为上下两部分，整个页面高度100vh（原因1：scroll-view高度需要固定高度；原因2：出现两个滚动条） 2 页面上半
转载
2024-06-01 02:52:32
321阅读
简介小程序某项目中有个需求：用户进入聊天页，自动到最底部，发送（接收）新消息也到最底部。 由于本身是小程序，且有支持的方法了，所以没有采用计算内容的高度，通过设置 scroll-top 的值，达到效果的方法（代码 冗余没必要）。 小程序API中有scroll-view标签组件，该组件有个方法：scroll-into-view（值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方
转载
2024-01-27 20:21:45
1083阅读
使用小程序的scroll-view组件实现列表页 scroll-view组件介绍scroll-view是微信小程序提供的可滚动视图组件,其主要作用是可以用来做手机端经常会看到的上拉加载下拉刷新列表页!下面就以<摇出微笑>为例来讲解一下这个组件的使用吧!为app导入新page页面首先需要为我们的小程序导入新的page页面,项目根目录打开app.json这个项目配置
转载
2024-05-10 12:57:21
319阅读
# 微信小程序iOS隐藏页面滚动条的方法
在微信小程序中，用户体验至关重要。对于一些需要展示内容但又不希望干扰用户视觉体验的页面，隐藏滚动条是一项很重要的功能。本文将介绍如何在iOS环境下隐藏微信小程序的页面滚动条，并提供相应的代码示例和详细步骤。
## 为什么要隐藏滚动条
在某些情况下，滚动条可能会影响页面的美观或用户的注意力。例如，当你设计一个以图片或视频为主的内容页面时，显示的滚动条可
原创
2024-10-01 06:45:46
454阅读
# 解决微信小程序 iOS 如何滚动的问题
在开发微信小程序时，我们经常会遇到需要实现滚动功能的情况，特别是在 iOS 设备上。在 iOS 设备上，由于系统的限制，有时候可能会出现滚动不流畅或者无法滚动的情况。下面我们就来介绍一种解决这个问题的方案。
## 方案概述
我们可以通过在小程序中使用一个特定的 CSS 样式来解决 iOS 设备上的滚动问题。这个样式可以让小程序在 iOS 设备上实现
原创
2024-03-15 05:21:16
157阅读
微信小程序滚动Tab选项卡：左右可滑动切换 最终效果如上。问题： 1、tab标题总共8个，所以一屏无法全部显示。 2、tab内容区左右滑动切换时，tab标题随即做标记（active）。 3、当active的标题不在当前屏显示时，要使其能显示到当前屏中。 一、wxml结构 tab标题因一排八个，所以使用 scroll-view组件，使其可横向滚动。 
转载
2024-10-08 16:33:58
70阅读
欢迎点击「算法与编程之美」↑关注我们！本文首发于："算法与编程之美"，
原创
2022-03-01 15:33:03
1626阅读
在小程序弹窗时，外部页面禁止滚动， 可以在最外部容器设置catchtouchmove但是如果弹窗内部也需要滚动，
原创
2022-07-06 16:38:45
750阅读
案例描述微信小...
原创
2021-06-30 10:47:42
1490阅读
在使用微信小程序时，很多开发者会遇到“控制iOS整个页面不能左右滚动”的需求。这种需求通常在电商应用、内容展示等场景中非常常见，确保用户在进行上下滑动时不会误触左右滚动，提升了用户体验。以下是我整理出的一些解决方案，包含了环境配置、编译过程、参数调优等模块，供大家参考。
## 环境配置
在进行开发之前，我们需要先配置好环境。以下是相关的步骤：
1. 确保你已经安装好 Node.js 和 np
小程序如何写一个优美的tab选项卡？wxml结构一共分为两个部分一个是tab头部和swiper构成的内容部分，用swiper做切换内容的盒子的好处是它能让用户的体验变得更好，出现如上所示的效果，当我点击tab头部是，下面的内容也会相应的切换，当滑动下方swiper的时候上方的tab头部相应的也会被点亮
wxml如下：<view class="content">
<!--头部t
最近在学习微信小程序，所以把一些重点给记录下来 废话不多说，先来一波效果图： gif动图太小了 这边再来几张图片 重点说明 本接口数据来源于玩Android开放api 地址：https://www.wanandroid.com/ 详细功能介绍： 上边是一个可滑动的横向分类栏 下面是点击分类栏切换到的界面以及下边可滑动改变当前页面数据，以及数据在请求数据时加载时间过长，所以将已加载过的数据进行本地化
转载
2024-01-05 14:39:09
115阅读
微信小程序实现滑动选项卡关于“如何做小程序的滑动式Tab选项卡，方法是什么”, 有一些人不是很理解，今天简单实现一下小程序的滑动选项卡。效果如下图所示： 这种设计结构其实在移动端是非常常见的设计，无论是h5 , app 还是 小程序，今天我们就用微信小程序来实现这个功能组件。首先我们可以把这个分成上下两部分结构，上面可以点击切换的 tab 标签和下面能切换的视图。首先我们分析上面，其实对于前端同学
转载
2024-08-11 10:25:52
202阅读
最近开发的一个小程序是用mpvue写的，UI框架用的是Vant。以下是总结：静态文件放在static文件夹下面是不会打包压缩的，所以在这个文件夹下面放的文件不宜太大，代码大小超过2M就必须分包了；mpvue的分包packageA不能建在和pages同级，同级的话vue文件编译不了wxml等文件，所以要建多个分包的时候，packageA等等都应该放在pages文件里面（父子文件夹）；Vant中的复选
在iOS平台上开发微信小程序时，经常会遇到滚动穿透的问题。这一问题通常发生于页面嵌套了多个滚动元素（例如，滚动视图和列表组件）时，导致用户在某些情况下无法正常滚动或事件传递出现异常。这不仅影响用户体验，同时也影响了小程序的功能性，使得开发者需要深入分析并解决这一问题。
### 问题背景
在移动设备上，用户往往会在多个场景下使用小程序，例如：
- **场景一**：用户在浏览商品时，滑动商品列表
先上案例最终效果： 案例实现功能：1.导航栏横向滚动效果2.当前元素有下划线标识3.点击元素，导航栏滚动到相应位置 以下将分步骤逐步完善陈述这些功能，最终会呈现所有代码 1.引用组件scroll-view，达到滚动效果万丈高楼平地起，首先要达到横向滚动的效果wxml<view>
<scroll-view scroll-x="true" enabl
转载
2023-08-29 18:42:11
290阅读
# 实现 iOS 微信小程序页面拖动的步骤详解
在 iOS 微信小程序中实现页面拖动功能是一项技能，适合刚入行的开发者来掌握。本文将系统地告诉你如何实现这一功能，包括具体的步骤、代码示例及详细注释。
## 整体流程
我们可以将实现 iOS 微信小程序的页面拖动功能分为以下几个步骤：
| 步骤 | 描述 | 预期结果
# 微信小程序 iOS 禁止页面的实现
随着移动互联网的快速发展，微信小程序成为了越来越多开发者的选择。但在小程序的开发过程中，我们常常会遇到一些平台特有的限制，尤其是在 iOS 平台上。本文将为大家介绍如何在微信公众号小程序中实现禁止页面，并提供代码示例，帮助开发者更好地应对这一限制。
## 1. 什么是禁止页面？
禁止页面是指当用户在小程序内的某些操作无效或不允许时，向用户展示的提示页面
在小程序中，拖拽的实现已经组件化了，可以用<movable-area>和<movable-view>这对父子标签来实现，当然也可以原生js去实现。这里切说一说我如何用这对父子标签实现的拖拽功能： 目录 一、了解<movable-area>和<movable-view>这对父子标签二、 案例 一、了解<m
转载
2024-09-20 11:37:49
204阅读
前言小程序上线刷爆了朋友圈，但是最近渐渐消沉了，很少有动静！最近公司项目需要，体验了一下微信小程序，制作了几个功能，布局感觉很简单，但是交互和动画等写起来确实很费劲，主要是因为他不能操作DOM，只能修改数据！下面介绍一下我制作小程序完成的几个小的功能，希望能够给开发小程序的朋友带来帮助！ 滚动动画制作小程序制作回到顶部，或者滚动到某个位置，很简单，也有很多实现方法！ 例如： 1、动态改
转载
2023-08-23 23:14:27
241阅读
