videoJS cordova IOS 播放视频双进度条问题

最新推荐文章于 2024-04-29 15:43:56 发布

九函

最新推荐文章于 2024-04-29 15:43:56 发布

阅读量2.8k

点赞数 1

分类专栏：混合开发 cordova ios 视频 videojs 文章标签： ios 视频 cordova video-js 进度条

本文链接：https://blog.csdn.net/qqKeG/article/details/73380400

版权

混合开发同时被 3 个专栏收录

4 篇文章 0 订阅

订阅专栏

cordova

3 篇文章 0 订阅

订阅专栏

ios

2 篇文章 0 订阅

订阅专栏

videoJS IOS 播放视频双进度条问题

**主要解决混合式开发 cordova 中 ios 视频播放出现双进度条问题，去掉ios 播放视频自带的控制栏

This.player = videoJs('video',{
       sourceOrder: true,
       sources: [{
           src: videoUrl,
           type: 'video/mp4'
       }],
       controlBar: true,
       // 增加当前属性
       nativeControlsForTouch: false,
       // 
       width: $('.content').width()
   });

如果iso 10版本需要增加css样式

video::-webkit-media-controls,
video::-webkit-media-controls-panel,
video::-webkit-media-controls-panel-container,
video::-webkit-media-controls-play-button,
video::-webkit-media-controls-volume-slider-container,
video::-webkit-media-controls-volume-slider,
video::-webkit-media-controls-mute-button,
video::-webkit-media-controls-timeline,
video::-webkit-media-controls-current-time-display,
video::-webkit-full-page-media::-webkit-media-controls-panel,
video::-webkit-media-controls-timeline-container,
video::-webkit-media-controls-time-remaining-display,
video::-webkit-media-controls-seek-back-button,
video::-webkit-media-controls-seek-forward-button,
video::-webkit-media-controls-fullscreen-button,
video::-webkit-media-controls-rewind-button,
video::-webkit-media-controls-return-to-realtime-button,
video::-webkit-media-controls-toggle-closed-captions-button,
video::-webkit-media-controls-start-playback-button {
    display: none !important;
    -webkit-appearance: none;
}