微信小程序隐藏scroll-view滚动条

最新推荐文章于 2024-06-05 09:46:36 发布

GradualJin

最新推荐文章于 2024-06-05 09:46:36 发布

阅读量1.2k

点赞数 1

分类专栏： css样式记录文章标签：微信小程序 javascript 前端

本文链接：https://blog.csdn.net/Not_affect/article/details/126303131

版权

本文记录了在微信小程序中如何通过设置样式来隐藏scroll-view组件的滚动条，以便在界面设计中获得更整洁的视觉效果。

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

隐藏scroll-view的滚动条

经常遇到又会忘记，在此记录一下隐藏滚动条的样式。


<scroll-view class="scroll-box">
</scroll-view>

//修改伪类属性
//css
<style lang="scss" scoped>
.scroll-box{

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

GradualJin

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
微信小程序隐藏scroll-view滚动条

隐藏scroll-view滚动条样式。
复制链接

扫一扫

专栏目录

微信小程序 scroll-view隐藏滚动条详解

08-31

主要介绍了微信小程序 scroll-view隐藏滚动条和跳转页面的相关资料,需要的朋友可以参考下

微信小程序隐藏scroll-view滚动条只需要添加show-scrollbar=“{{false}}“ enhanced=“{{true}}“即可，亲测有效！

番茄Salad

10-18

2907

微信小程序只需要在scroll-view上面添加show-scrollbar=“{{false}}” enhanced="{{true}}"即可解决。UniApp则修改成:show-scrollbar=“false” enhanced=“true”微信小程序的scroll-view在ios上没有显示滚动条，但是如果在安卓设备上会显示一个滚动条。

1 条评论您还未登录，请先登录后发表或查看评论

滚动条详解：跨平台iOS、Android、小程序滚动条隐藏及自定义样式综合指南

热门推荐

烟溪彭于晏的博客

07-27

1万+

当小程序页面展示内容超过屏幕高度或宽度，我们想要看到全部内容，这时候就必须用到页面滚动。可是，我们发现滚动页面的滚动条特别的突兀和丑陋，而且参考大部分的小程序都是将滚动条去掉了。如果仍然无效，减少height的值，例如设为height99vh。scroll-view高度大于page高度仍会出现滚动条的。scroll-view高度不要设置为相对高度，如100%。否则，page页面的滚动条又会出现了！当展示内容超过页面高度，会触发page默认的滚动条。scroll-view，隐藏滚动条的方法也很简单。...

详解微信小程序scroll-view横向滚动的实践踩坑及隐藏其滚动条的实现

10-17

总之，微信小程序scroll-view组件的横向滚动实践踩坑及其滚动条的隐藏，需要开发者在实践中不断尝试和总结经验。通过上述方法的实践应用，可以有效地解决开发过程中遇到的问题。对于小程序的样式调整和功能实现，...

微信小程序scroll-view组件实现滚动动画

08-28

微信小程序 scroll-view 组件实现滚动动画 微信小程序 scroll-view 组件是一种常用的滚动容器组件，通过设置 scroll-into-view 和 scroll-with-animation 属性可以实现滚动动画效果。在本文中，我们将详细介绍如何...

微信小程序scroll-view实现字幕滚动

01-03

本文实例为大家分享了微信小程序scroll-view实现字幕滚动的具体代码，供大家参考，具体内容如下需求：实现框内的文字自下而上的自动循环滚动。解决方案： demo:字幕滚动通过控制滑动条来完成字幕滚动，通过...

微信小程序中scroll-view中不设定高度实现自动滚动

09-17

### 微信小程序中scroll-view实现自动滚动及高度自适应 #### 一、问题背景与需求分析在微信小程序开发过程中，经常会遇到需要使用`scroll-view`组件来展示可滚动内容的需求。通常情况下，为了使`scroll-view`能够...

scroll-view隐藏滚动条

XXCJLRC的博客

02-14

725

微信小程序scroll-view隐藏滚动条

微信小程序：scroll-view横向滚动的使用和隐藏滚动条

彭世瑜的博客

11-29

4433

文档： https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html 横向滚动 <scroll-view class="scroll__wrap" scroll-x="true"> <block wx:for="{{[1, 2, 3, 4, 5]}}"> <view class="scroll__item">{{item}}</view

微信小程序 - 完美去除＜scroll-view＞ 滚动条，保证 100% 去掉隐藏苹果 ios 系统、安卓滚动条（解决 ios 苹果真机scroll-view无法隐藏滚动条）详细示例代码，保证可用

王佳斌

05-28

5469

微信小程序scroll-view滚动条，微信小程序去除隐藏去掉scroll-view滚动条，微信小程序scroll-view苹果ios系统手机去除滚动条，微信小程序scroll-view如何去掉滚动条，微信小程序scroll-view隐藏滚动条，微信小程序scroll-view无法去掉 ios 苹果系统的滚动条，微信小程序隐藏scroll-view滚动条在苹果ios系统不生效，微信小程序scroll-view在苹果ios系统下有滚动条怎么去除隐藏，微信小程序scroll-view去掉ios苹果系统滚动条，微

uniapp scroll-view滚动条不显示及IOS中问题

細水、長流√的专栏

02-27

3629

最近在对小程序进行一些优化，发现 scroll-view 的两处问题1、IOS手机下scroll-view会存在上拉加载时卡顿情况2、IOS手机下scroll-view会存在点击不触发 navigator-hover 里的css没有找到什么好的解决办法，故只有用view替代了scroll-view。

微信小程序 SCROLL-VIEW的滚动条设置

細水、長流√的专栏

02-27

5175

小程序的scroll-view用的比较多了，列表页一般也没管它的滚动条，最近突然发现在android与ios中横向滑动的时候表现不一样。上图位置:-webkit-scrollbar-thumb 滚动条里面的小方块，能向上向下移动（或往左往右移动，取决于是垂直滚动条还是水平滚动条）。上图位置:-webkit-scrollbar-button 滚动条的轨道的两端按钮，允许通过点击微调小方块的位置。上图位置:-webkit-scrollbar-corner 边角，即两个滚动条的交汇处。

uniapp隐藏scroll-view滚动条

smileKH的博客

03-24

2567

uniapp scroll-view

uniapp scroll-view 隐藏滚动条

Lsir1998的博客

05-17

1224

如果是想全局隐藏的话，可以放在App.vue中，如果是局部则在对应的页面中引入使用即可。

微信小程序scroll-view隐藏滚动条

09-14

可以通过设置 scroll-view 组件的属性来隐藏滚动条。你可以将 scroll-view 的属性 scroll-x 或 scroll-y 设置为 false，以禁用对应方向的滚动条。下面是一个示例代码，演示如何隐藏 scroll-view 的滚动条： ```html <scroll-view scroll-x="false" scroll-y="false">  </scroll-view> ``` 在上面的代码中，scroll-x 和 scroll-y 的值都设置为 false，意味着不显示水平和垂直方向的滚动条。通过这种方式，你可以隐藏 scroll-view 组件的滚动条。希望能对你有所帮助！如果还有其他问题，请随时提问。