小程序 Component 去掉 scroll-view 的滚动条

最新推荐文章于 2024-05-07 09:09:46 发布
原创 最新推荐文章于 2024-05-07 09:09:46 发布 · 500 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了如何在scroll-view组件中设置enhancedshow-scrollbar属性为false，以实现无滚动条效果，适合前端开发者了解和应用。

为 scroll-view 添加 两个属性 enhanced show-scrollbar="{{false}}"

微信小程序 - 完美去除 ＜scroll-view＞ 滚动条，保证 100% 去掉隐藏苹果 ios 系统、安卓滚动条（解决 ios 苹果真机scroll-view无法隐藏滚动条）详细示例代码，保证可用
🏆 前端领域优质创作者
05-28 1万+
微信小程序scroll-view滚动条，微信小程序去除隐藏去掉scroll-view滚动条，微信小程序scroll-view苹果ios系统手机去除滚动条，微信小程序scroll-view如何去掉滚动条，微信小程序scroll-view隐藏滚动条，微信小程序scroll-view无法去掉ios苹果系统的滚动条，微信小程序隐藏scroll-view滚动条在苹果ios系统不生效，微信小程序scroll-view在苹果ios系统下有滚动条怎么去除隐藏，微信小程序scroll-view去掉ios苹果系统滚动条，微
微信小程序scroll-view联动滚动
weixin_43296716的博客
07-23 2647
微信小程序scroll-view联动滚动前言scroll-viewquery.select('标签名' ).boundingClientRect().exec()最后一条内容区比较少，点击无效果。 前言 在做微信小程序的时候，需要用到联动滚动，类似于美团的点餐，在网上搜了很多，发现不是很全，在这里自己总结一下 scroll-view 如果想要实现纵向滑动，除了设置scroll-y为true，还必...
scroll-view取消滚动条
最新发布
Dreamer
05-07 1803
之前在写scroll-view时，发现移动端自己带了滚动条，在横向滚动的时候就比较不好看，于是想着去除掉页面的滚动条。当时在uni-app官网上看到使用。控制滚动条是否出现，默认为false,于是我就十分的迷惑，既然默认false，为什么我没有设置就出现了滚动条…于是在设置了这两个属性之后就成功去除了滚动条。在百思不得其解的时候去翻了一下微信开放文档，发现。是默认为true的，并且需要和。
微信小程序scroll-view隐藏滚动条的方法详解
11-20
效果图： 1.scroll-view 中的需要滑动的元素不可以用 float 浮动使其一行展示； 2.包裹scroll-view的元素如果用 display:flex; 是没有滚动效果的； 3.scroll-view 中的需要滑动的元素要用 dislay:inline-block; 进行元素的横向编排； 4.包裹 scroll-view 的元素要加上样式–> overflow:hidden;white-space:nowrap; 5.有时候为了美观要隐藏滚动条，需要在样式里加上 核心代码： 在wxss里加入以下代码 ::-webkit-scrollbar{ width: 0; he
scrollView 微信小程序 scroll-view 去掉滚动条 隐藏滚动条 解决方案 解决方法
SupperPigger的博客
05-30 5533
微信小程序去掉scroll-view滚动条的方式 在微信小程序的项目开发中，时常有需要用到scroll-view的地方。 但是使用scroll-view就难免的会出现默认的滚动条，很影响页面的样式。 我在做项目的时候就遇到了这样的问题，然后去网上搜索，结果搜索出来很多都是说通过添加下方CSS来达到的。 ::-webkit-scrollbar { width: 0; height: 0;...
微信小程序scroll-view两个页面的滚动
qq_48354174的博客
12-25 1011
从当前页面跳到下个页面时，scroll-view发生滚动到相应的位置 官方组件： https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html 首先需要给scroll-view动态设置一个scroll-left="{{scrLeft}}"（设置横向滚动条位置） 然后再获取点击值的下标并把下标赋值进去 wx.getSystemInfoSync()来获取设备的信息，更新 data 数据的值，然后把getScrLeft方法带
微信小程序scroll-view组件滚动到底部
weixin_44028979的博客
11-30 1549
场景需求：聊天室每次接受到新小程序滚动条自动滚动到底部 采用方法 设置scroll-into-view 在底部写一个容器并且设置id 在js data中定义toView并设置默认值底部容器id <scroll-view class="Ktalist" scroll-y="{{true}}" scroll-into-view="{{toView}}" scroll-with-animation="true" > <view class="Kteliblock" wx:fo
使用scroll-view实现组件滚动（无法显示滚动组件的原因之一）
weixin_49218184的博客
04-12 1015
**竖向滚动** 源代码： <!--pages/scroll-view/lab1.wxml--> <!-- 允许组件滚动 --> <scroll-view class="container1" scroll-y> <view>A</view> <view>B</view> <view>C</view> </scroll-view> /* pages/scroll-view/l
微信小程序组件scroll-view可滚动视图区域
weixin_50564041的博客
10-19 1407
可滚动视图区域。使用竖向滚动时，需要给scroll-view一个固定高度，通过 WXSS 设置 height。组件属性的长度单位默认为px，2.4.0起支持传入单位(rpx/px)。 1、属性：scroll-x 类型：boolean 默认值：false 允许横向滚动 2、属性：scroll-y 类型：boolean – – 默认值：false 允许纵向滚动 3、show-scrollbar 类型：boolean – – true 滚动条显隐控制 (同时开启 enhan
微信小程序（九）scroll-view组件详细介绍
09-01
主要介绍了微信小程序scroll-view组件详细介绍的相关资料,需要的朋友可以参考下
微信小程序scroll-view去掉滚动条
热门推荐
qq_45021462的博客
06-14 1万+
微信小程序scroll-view去掉滚动条的解决方案
html，小程序scroll-view去除滚动条
weixin_46465090的博客
04-17 969
进入正题，有时候在项目中，需求不想要某些滚动条怎么办呢？ 首先看HTML解决滚动条的方法。 方法1.父盒子overflow:hidden 子盒子比父盒子宽17 实现视觉隐藏滚动条（为什么是17px呢，因为自己测了下，滚动条宽度就是17px） 子盒子添加内容溢出滚动条显示属性 overflow-y:scroll 并设置好宽高 可实现隐藏滚动条也可是滚轮触发滑动，使用此方法 无法监听wind...
uniapp中scroll-view去除滚动条
bjt1015999的博客
02-26 6936
uniapp中我们使用scroll-view实现横向或者竖向滑动时，我们会发现横向或者竖向是有一个滚动条的，不是很美观，那么我们就可以尝试去去除一下滚动条（如果采用以下官方方法无法去除时，那么请向官方反馈信息）width: 0!important;height: 0!important;说明：可能在某个设备上还是有问题，等待官方小助手解决吧。
微信小程序 -- 去掉scroll-view滚动条（测试有效）
Emily
08-02 8470
细节很重要，如下加下划线的注意点要记住了。 去掉scroll-view的滚动条其实很简单，只需要添加以下样式： scroll-view ::-webkit-scrollbar { width: 0; height: 0; color: transparent; display: none; } 但是需要注意的是，如果只是如下写法，可能只能把scroll-view滚动条由...
微信小程序去除滚动条 (安卓、ios都有效)
weixin_45389051的博客
02-22 1204
【代码】微信小程序去除滚动条 (安卓、ios都有效)
小程序scroll-view如何去除滚动条
swx999的博客
03-29 436
::-webkit-scrollbar { width: 0; height: 0; color: transparent; }
微信小程序 scroll-view 隐藏横向滚动条（强迫症的福音）
DreamCoders
08-27 6504
最近在折腾自己的小程序，其中用到了scroll-view用的比较多了，一般在列表展示页都要用到这个，在进行滑动的时候边上都会有一条滚动条，竖向的还无所谓，横向的就看着很别扭了。 在开发工具上预览是没有问题的，上传预览后在手机上显示就会出现一条黑色长条。效果图如下 虽然不是很明显，还是我有强迫症，看着很不爽，所以打算把它去掉。 然后打开官方demo，找了一遍官方文档，没有任何说明，这也是官方...
微信小程序完美去除scroll-view的滚动条
qq_43529575的博客
02-26 1319
最近在帮一个同学做一个微信小程序，中间使用到了小程序的原生组件<scroll-view>，拿来做一个滚动的效果，遇到了隐藏滚动条的问题，在优快云上搜索了很多博客，发现解决方法并不能解决问题 首先，我们想去除项目中的滚动条 优快云上找到的方法大多都是下面这样，在对应的wxss文件中，写入下面的代码::-webkit-scrollbar{ width: 0; height: 0...
小程序检测scroll-view滚动距离
05-17
可以通过监听scroll-view组件的scroll事件，获取滚动的位置信息，从而计算滚动距离。 具体步骤如下： 1. 在scroll-view组件上绑定一个scroll事件：`<scroll-view scroll="onScroll"></scroll-view>` 2. 在小程序的Page或Component中定义一个onScroll方法来处理事件： ```javascript onScroll: function(e) { console.log(e.detail.scrollTop) // 根据scrollTop属性的值进行相应的处理 } ``` 在这个方法中，e.detail.scrollTop表示滚动条滚动的距离，可以根据这个值进行相应的处理，比如控制某个元素的显示或隐藏、发起网络请求等。 注意，当滚动到底部时，可以通过判断scroll-view组件的scroll-into-view属性是否为某个元素的id来触发加载更多数据的操作。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值