小程序video层级过高 !解决方案之------- cover-view!

在小程序用应用视频地图等组件时会发现由于这些组件层级过高会覆盖到我们的导航栏!即使我们设置了定位给z-index 9999,

但是在真机测试时依然会失效!那么就要用到组件盖视图

<video src=""></video>
<cover-view>我要盖住你</cover-view>

用盖视角写导航栏就可以覆盖到视频上面了!但是有几个小坑要注意!

1,cover-view内只能嵌套<cover-view> <cover-image> <button> <navigator> <official-account>其他标签在真机会被忽略!

2,如果您想让盖视点覆盖视频,那么在wxml中一定要把盖视图标签写在视频后面

3,如果视频标签上面有wx:if判断,那么它的显示是异步的,即使吧cover-view标签写在后面,有时也不生效,因为cover-view标签先生染

4,cover-view标签定义css时一些属性不能用比如border

5,盖视图有其默认属性 

cover-view {
display:block;
line-height:1.2;
overflow:hidden;
white-space:nowrap;
pointer-events:auto;

}

 

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 8
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值