微信小程序> 微信小程序video黑屏了加封面

微信小程序video黑屏了加封面

浏览量:2535 时间: 来源:L林蛋大

wxml页(Autoplay是否自动播放,poster是否显示视频封面,controls为true的前提下poster才有效,cover-image放的图片是网络图片,不是本地图片)

<video id='myVideo' bindplay='play' Autoplay='{{liuliang}}' src="{{video[index].activity_video}}" poster="{{serverhost}}{{video[index].activity_video_cover}}" controls='true' objectFit='fill'>    //视频

<cover-view class='liuliang'>

<cover-view class='iconfont'>

</cover-view>

</cover-view>

<cover-view style='display:{{coverdisplay}}'>

<cover-image  mode="widthFix"  src='{{serverhost}}{{video[index].activity_video_cover}}'></cover-image>  //视频封面, mode="widthFix"为image的属性,可以自适应撑大视频封面不失真,不用再去调样式

</cover-view>

</video>

 

js页

data{

internet:'',                      //网络状态

liuliangshow: 'false',    //网络状态显示

coverdisplay: 'none',   //poster图片显示

}

ps:作者用的调试基础库为1.9.91版本进行测试

 

 

 

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

最新资讯

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎