微信小程序停止其他视频播放当前视频的实例代码

微信(小程序)  /  管理员 发布于 2年前   435

微信小程序停止其他视频播放当前视频，代码如下所示：

                                                       {{item.title}}      `

css 样式

.content { border-top: transparent 1px solid; box-sizing: border-box; /* height: 100%; */ width: 100%; padding: 0 20rpx;}.container{ border-top: transparent 1px solid; /* box-sizing: border-box; */ /* height: 100%; */ width: 100%;}view { vertical-align:middle;}.item-box { width: 100%; margin-top: 40rpx; position: relative;}.video-title-box{ height: 70rpx; width: 100%; background:rgba(0,0,0,1);opacity:0.2; position: absolute; bottom: 10rpx;}.video-title{ text-align: center; font-size: 30rpx; line-height: 70rpx;font-weight:400;color:rgba(255,255,255,1);}.item-box{ width: 100%; display: -webkit-box;  -webkit-box-orient: vertical; -webkit-line-clamp:2; overflow: hidden; text-overflow:ellipsis;}.item-box .video-image-box { height: 400rpx; width: 100%; background-repeat: no-repeat; background-size: 100% 100%; background-position-x: 30rpx; position: relative;}.video-cover-box{ height: 100%; width: 100%; text-align: center; line-height: 0rpx;}.item-box:first-of-type{ margin-top: 0rpx;}.item-box .video-image-box .video-cover-box .video-image { height: 100%; width: 100%;}.item-box .video { height: 300rpx; width: 100%; margin: 0 30rpx 0 0; position: relative;}.item-box .video-image-box .video-image-play { position: absolute; width: 80rpx; height: 80rpx; top: calc(50% - 40rpx); left: calc(50% - 40rpx); z-index: 100;}

js  代码

const app = getApp()Page({ data: {  videoPlay: null,  videelsi: [], }, onLoad: function () {  wx.hideShareMenu()  this.vidoelist() }, vidoelist() {  app.api.getData(app.data.https + 'wechat/farm/index').then(res => {   console.log(res)   this.setData({    videelsi: res.data.list   })  }) }, // 点击cover播放，其它视频结束 videoPlay: function (e) {  var _index = e.currentTarget.dataset.id  this.setData({   _index: _index  })  //停止正在播放的视频  var videoContextPrev = wx.createVideoContext(_index + "")  videoContextPrev.stop();  setTimeout(function () {   //将点击视频进行播放   var videoContext = wx.createVideoContext(_index + "")   videoContext.play();  }, 500) }})

总结

以上所述是小编给大家介绍的微信小程序停止其他视频播放当前视频，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！

您可能感兴趣的文章:

• 小程序点击图片实现自动播放视频
• 小程序视频列表中视频的播放与停止的示例代码
• 在小程序中使用腾讯视频插件播放教程视频的方法
• 微信小程序使用video组件播放视频功能示例【附源码下载】
• 微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义实例
• 微信小程序-图片、录音、音频播放、音乐播放、视频、文件代码实例
• 微信小程序 vidao实现视频播放和弹幕的功能