2***@qq.com
2***@qq.com
  • 发布:2021-01-11 14:16
  • 更新:2022-03-30 19:08
  • 阅读:3114

uniapp h5端如何隐藏横向和竖向滚动条?

分类:uni-app

我一共找到两种方法,但是在h5端都无效,请大神指教
下面这个方法是加在app.vue中 试了无效

/* #ifdef H5 */  
    ::-webkit-scrollbar {  
        display: none;  
        width: 0 !important;  
        height: 0 !important;  
        -webkit-appearance: none;  
        background: transparent;  
    }  
    /* #endif */

下面这个方法是官网提供的,加在pages.json中,但是只在app中有效,h5端没有效果

"app-plus": {  
        "scrollIndicator": "none"  
    }
2021-01-11 14:16 负责人:无 分享
已邀请:
2***@qq.com

2***@qq.com - aaaa

在整个页面样式上加上个overflow:auto;

2***@qq.com

2***@qq.com - aaaa

应该是html这个dome节点上的滚动条没有隐藏掉导致的,重点是要html{overflow:auto}

7***@qq.com

7***@qq.com - 江江123

::-webkit-scrollbar{
display: none;
}
这样就可以;

  • 2***@qq.com (作者)

    看我上面代码 加的有 没有效果

    2021-01-11 14:22

  • 7***@qq.com

    回复 2***@qq.com: 这么恐怖的吗。。。是不是搞了什么引起冲突了,正常来说是可以的,把那个编译条件去掉试试咯

    2021-01-11 14:25

crazyu

crazyu - 个人承接uni.app、Vue、, React,做过后台管理系统、h5、小程序、ipad应用(uni app开发),价格美丽,欢迎来聊

::-webkit-scrollbar {
width: 0;
height: 0;
color: transparent;
}
试试

  • 2***@qq.com (作者)

    也不行

    2021-01-11 15:01

  • crazyu

    回复 2***@qq.com: 我自己运行了h5,我不加代码都是没有滚动条的,提供复现的demo试试

    2021-01-13 15:33

阿瓜的IT之旅

阿瓜的IT之旅

刚才试了下,博主说的那个方法是可以的

该问题目前已经被锁定, 无法添加新回复