专栏首页毛毛v5uni-app h5 吸底部,滚动固定底部css

uni-app h5 吸底部,滚动固定底部css

需要用到h5得position新属性 sticky。主要是uni-app,其中变量--window-bottom是uniapp得预定义变量。目的是底部空出tabbar的高度。 css如下:

.position-sticky {
    position: -webkit-sticky!important;
    position: sticky!important;
}
    
.fixed-bottom {
    position: fixed;
    right: 0;
    bottom: calc( var(--window-bottom) + 3px);
    left: 0;
    z-index: 1030;
    margin-bottom: 6;
}

h5代码:

<template>
    <view class="info position-sticky fixed-bottom" v-if="zmMusicInfo.songList.length > 0" >
....
    </view>
</template>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • vc第三方库辅助管理工具vcpkg的安装使用

    安装vcpkg很简单,直接从M$的git仓库:https://github.com/Microsoft/vcpkg.git 拉一下代码,然后编译就行了。

    xiny120
  • uni-app设置android的锁屏壁纸(android.app.WallpaperManager)。。。

    还是有个问题,壁纸在华为note8上面显示大图片,导致只能显示一部分啊。搞不动。锁屏壁纸正常。

    xiny120
  • golang db.Prepare select top ? order by ?

    用的这个驱动 _ "github.com/go-sql-driver/mysql" 经过测试,貌似golang的 db.Prepare在查询字符串中 不能使用...

    xiny120
  • 网易MySQL微专业学习笔记(六)-内置函数

    这个系列属于个人学习网易云课堂MySQL数据库工程师微专业的相关课程过程中的笔记,本篇为其“MySQL数据库对象与应用”中的MySQL数据类型相关笔记。

    汐楓
  • Spring Boot (八)MyBatis + Docker + MongoDB 4.x

    MongoDB是一个强大、灵活,且易于扩展的通用型数据库。MongoDB是C++编写的文档型数据库,有着丰富的关系型数据库的功能,并在4.0之后添加了事务支持。

    Java中文社群_老王
  • Oracle数据库 拾漏补缺

    select语句的基本使用 可以查询需要的列,行,可以进行多表链接,连接查询。 ? select e.*,e.sal/30 from p_emp e selec...

    二十三年蝉
  • 换马甲:十分钟 Helm 变 Operator

    Operator 是一种将传统运维思路转换为 Kubernetes CRD 控制的方法,利用 CRD 对软件部署和配置进行定义,整个部署和管理过程在 Kuber...

    崔秀龙
  • raw镜像与qcw2镜像互相转换

    raw格式是原始镜像,会直接当作一个块设备给虚拟机来使用,至于文件里面的空洞,则是由宿主机的文件系统来管理的,linux下的文件系统可以很好的支...

    yaohong
  • handler thread

    week
  • 提升云计算体验 采用四个小工具

    云计算的出现改变了传统的业务模式。但最近频频出再安全漏洞事件,却也使企业在使用云计算技术上生了胆怯,尤其是这些安全事件还有上升的趋势,据美国电信运营商Veriz...

    静一

扫码关注云+社区

领取腾讯云代金券