收藏
回答

vido视频用contain属性为什么视频会有黑边出现呢

框架类型 问题类型 操作系统 工具版本
小程序 Bug Windows 2.7.1

尝试了很多种方法如下:

1、用其余两个属性会吧小视频拉大,所以只能采用contain这个属性,但是这个属性在会有黑边,反复尝试发现只有在加了tarbar情况下是没有黑边的,加了tarbar情况下用contain这个属性是有黑边的,也用自定义的tarbar尝试了,也是有黑边,只要不加tarbar就灭有这个问题,真机情况下跟开发工具一样都有这个问题,请求大家帮助下,这问题怎么解决呢?谢谢啦

<video style="padding-top:{{bar_Height  + 45}}px;" src='{{src}}' style='border:none' object-fit="contain" controls='{{false}}' loop autoplay bindtouchstart="touchStart" bindtouchend="touchEnd" style="width:{{windowWidth}}px;height:{{windowHeight}}px">


video{position: relative;top: 0rpx;left:0px;object-fit: contain;margin: 0;padding: 0;display: block}


这是加了tarbar的情况下有黑边



这是没有加tarbar的情况下没有黑边



回答关注问题邀请回答
收藏

2 个回答

  • 社区技术运营专员-灵芝
    社区技术运营专员-灵芝
    2019-05-31

    contain属性 被替换的内容将被缩放,以在填充元素的内容框时保持其宽高比。 整个对象在填充盒子的同时保留其长宽比,因此如果宽高比与框的宽高比不匹配,该对象将被添加“黑边”。

    2019-05-31
    有用
    回复 15
    • 昔日
      昔日
      2019-05-31

      但是用手机拍的也是不可以的都是存在黑边,而且呢不加tarbar的情况下,视频是不存在黑边的,加了就存在黑边了,这是怎么回事呢?

      2019-05-31
      回复
    • 昔日
      昔日
      2019-05-31

      https://developers.weixin.qq.com/s/IsaAOMmS7x85

      这是代码片段


      2019-05-31
      回复
    • 昔日
      昔日
      2019-05-31

      而且用这个contain属性在ios下是不沾满全屏的,用这两个属性fill,cover真机情况下是占满全屏了但是正方形的小视频就会被拉变形,所以这个问题改怎么处理呢???

      2019-05-31
      回复
    • 昔日
      昔日
      2019-05-31

      这个是用cover属性来的,都特别合适,就是视频是正方形的情况下视频变形了,不能保证视频正常出现。

      cover属性跟fill都是这样子的情况,麻烦官方尽快看下,急急急

      这是片段代码https://developers.weixin.qq.com/s/VqdZiMmc7q8L


      2019-05-31
      回复
    • 社区技术运营专员-灵芝
      社区技术运营专员-灵芝
      2019-05-31回复昔日

      这个是正常的预期表现呀,主要是看你视频的宽高比与容器的宽高比是否一致,不一致的情况下你需要的显示效果是什么来选择object-fit

      2019-05-31
      回复
    查看更多(10)
  • 昔日
    昔日
    2019-05-31

    着急,请求大家帮忙看看吧

    2019-05-31
    有用
    回复 7
    查看更多(2)
登录 后发表内容