微信小程序页面上下滚动（附源码）

最新推荐文章于 2023-11-10 23:07:13 发布

刺心疯

最新推荐文章于 2023-11-10 23:07:13 发布

阅读量4.2k

点赞数 1

分类专栏：微信小程序

本文链接：https://blog.csdn.net/qq_42363090/article/details/93210799

版权

微信小程序专栏收录该内容

121 篇文章 12 订阅 ¥69.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了如何在微信小程序中实现页面的上下滚动功能，并提供了相关的wxml、js和wxss源码示例。

摘要由CSDN通过智能技术生成

在这里插入图片描述
废话不多说直接上源码

wxml

<view class="container container-fill">
	<view class="scroll-fullpage" bindtouchstart="scrollTouchstart" bindtouchmove="scrollTouchmove" bindtouchend="scrollTouchend" style="transform:translateY(-{
  {scrollindex*100}}%);margin-top: {
  {margintop}}px">
		<view class="section section01 {
  {scrollindex==0?'active':''}}" style="background: #3399FF;">
			<text class="section-maintitle">页面1</text>
			<text class="section-subtitle">我的页面”1</text>

了解本专栏