- 综合排序
- 最热优先
- 最新优先
- 来自专栏开源小分队
超强H5视频播放器！！！
今天给大家介绍一款强大的HTML5视频播放插件。 概述 MuiPlayer是一款H5视频播放插件，默认配置了精美可配置的播放控件，包括了常用的播放场景，例如全屏播放、播放快进、循环播放、音量调节、视频解码等功能。 支持 mp4、m3u8、flv 等多种媒体格式播放，解决大部分兼容问题，同时适应在PC、手机端播放。 MuiPlayer 除了默认的简单配置，还具有丰富的参数可以自定义播放器实例，通过轻松的配置即可完成自定义场景的视频播放。 DOCTYPE html> <html> <head> <meta charset="utf-<em>8</em>"> <title>Simple</title> <link rel="stylesheet
2.8K20编辑于 2022-12-06 - 来自专栏npm包插件
纯原生编写的h5视频播放器
snail-player-native 一个纯原生代码编写的h5视频播放器, 功能完善，基本满足使用，仅供学习，禁止商用 演示 演示加速 复制该链接新打开页面：https://webrabbit.oss-cn-beijing.aliyuncs.com DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-<em>8</em>"> <title>Title</title> <style> document.getElementsByClassName(cls)[0] } } export default Utils Function - 按空格键暂停播放 - 点击屏幕暂停播放 - 视频进度条拖拽 ，区分颜色 - 鼠标移动到进度条上方显示时间 - 视频快进慢放 - 视频声音控制 - 画中画 - 整屏播放 - 双击全屏播放 - 等 运行环境 支持es6的各种浏览器 最好用chrome 源码地址，欢迎
1.8K71编辑于 2022-05-30 - 来自专栏开源技术小栈
工具系列 | H5自定义视频播放器实现
前言 目前，只是对自定义视频播放器的初步实现，之后会逐步完善! 一、H5视频、声频常用方法 1.canPlayType(); 检查浏览器是否能够播放指定的视频、声频。 二、H5视频、声频常用属性 1.autoplay属性 自动播放 使用autoplay属性，当视频播放准备工作一旦完成，视频马上播放。 值 说明 返回值 布尔值，返回true：播放结束返回false：播放没有结束 JavaScript 语法 audio/video.ended 8.loop属性 设置或返回视频、声频是否反复播放 使用loop （7）onvolumechange事件 为更改了声频、视频的音量时触发的事件 （8）onwaiting事件 为视频因为需要下载下一帧而停止时触发的事件 如果系统的看过以上H5声频、音频的相关知识，那么以下栗子就可以看得懂了 jquery-2.2.3.min.js"></script><script type="text/javascript" src="js/remauto.js"></script><title>自定义视频播放器
6.2K10发布于 2020-07-23 - 来自专栏崔哥的专栏
H5的音视频播放器 —— MediaElement.js
首先，只需嵌入
3.6K10编辑于 2022-06-12 - 来自专栏国标视频云平台
免费视频直播、点播H5播放器SkeyeWebPlayer适配移动端
免费视频直播、点播H5播放器SkeyeWebPlayer适配排除，移动端，常见移动端Web页面问题及解决方案SkeyeVSS其独创的ws-rtsp流媒体直播技术，兼容传统安防流媒体的同时，不需要安装浏览器插件 ，解决互联网接入安防监控延迟高、起播慢等问题；支持全平台终端H5直播点播（PC、Web、Android、iOS）。 一般情况下SkeyeWebPlayer播放器的宽度是自适应，高度css 或者 new WebMediaPlayer()中的height参数来设置，常用的56.25 （56.25% 等于 16:9 ）上传失败 SkeyeWebPlayer 播放器默认情况下会根据屏幕宽度自动进行自适应，默认宽度等于100%，在外部盒子没有设置宽度的情况下，播放器的宽度与屏幕相等，在初始化播放器 height：0 或者不设置时， left: 0; width: 100vw; height: 100vh; }}</style>强制横屏如图：（强制通过页面 禁止app或手机的横竖屏的切换是不现实的，H5
2K20编辑于 2023-04-04 - 来自专栏腾讯移动品质中心TMQ的专栏
如何从海量用户中轻松定位H5视频播放器问题？
所以需要一种快捷准确的方案，能从成千上万用户的播放失败的源中找出是由于播放器或者是代码导致的问题。在这种情况下，引入了视频播放器问题定位方案。 三、HTML 5 视频介绍 前面介绍框架中涉及QQ浏览器、UC浏览器、Chrome浏览器视频播放验证的，为了更加清楚了解验证视频可播放性的原理，首先我们来认识一下HTML5视频（简称H5视频）的的HTML height pixels 设置视频播放器的高度。 src url 要播放的视频的 URL。 width pixels 设置视频播放器的宽度。 开始播放音频/视频 pause() 暂停当前播放的音频/视频 从这个例子中，我们可以看出以下几点： 首先，如果视频页面没有HTML页面如果没提供VIDEO标签，肯定是不支持H5视频的播放，所以这种视频的 问题3：ku6网站少量片源m3u8视频源不规范的问题。 根本原因: 获取的视频裸地址是.m3u8格式的，播放解析的m3u8文件后，里面文件不是ts类型，而是mp4类型。
2.9K80发布于 2018-02-06 - 来自专栏Web前端知识点概要
视频播放器
DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-<em>8</em>"> <meta name="viewport" content="width= device-width, initial-scale=1.0"> <title>视频播放器</title> <link href="css/font-awesome.min.css" rel="stylesheet
5.4K00发布于 2020-05-07 - 来自专栏国标视频云平台
免费视频直播、点播H5播放器SkeyeWebPlayer播放常见问题
免费视频直播、点播H5播放器SkeyeWebPlayer使用常见问题1、用常见问题——配置iframe允许自动播放和全屏SkeyeWebPlayer播放器在PC上正常情况下单击播放器的全屏按钮是可以全屏播放的 /static/SkeyeWebPlayer/libVSS.wasm'), to: './' } ])],在html中直接使用 demo下载地址4、用常见问题——H265视频流播放 图片解决方法：同上更多文章在VUE项目中使用永久免费H5直播点播播放器SkeyeWebPlayer.js
2.2K30编辑于 2023-04-04 - 来自专栏个人路线
OpenHarmony视频播放器
，于是有了这个教程，本教程在最后也是实现了一个简单的播放器。 在这儿，我同样需要将setCurrentTime单独拎出 setCurrentTime8+ setCurrentTime(value: number, seekMode: SeekMode) 指定视频播放的进度位置 SeekMode8+类型接口说明 名称描述PreviousKeyframe跳转到前一个最近的关键帧。NextKeyframe跳转到后一个最近的关键帧。ClosestKeyframe跳转到最近的关键帧。 ) .onClick(() => { this.controller.exitFullscreen() }).margin(8) this.controls }).margin(8) Button("指定视频播放的进度") .onClick(() => {
5.9K20编辑于 2022-12-05 - 来自专栏Krryblog
自制 h5 音乐播放器 可搜索
温馨提醒： 本播放器并不需要什么特别的运行环境，直接下载打开就能用了 ^_^ 响应式优化，可在各种大小的设备运行打开 音乐搜索的结果均来自 qq音乐 （后续会继续扩大到多个平台） 本播放器还有一些 bug 谈谈开发： 果断使用的是 H5 播放器，十分好用 一般在做这种播放器的开发，要多多使用面向对象的开发思想。 定义一个播放器对象，相关参数、方法如下： 播放器对象：krAudio 参数： 播放器：audioDom 进度条锁定：locked:true 进度条按下的锁：kdown 静音的锁：flag_volume lrc_content_notext").text("暂无歌词"); 6 $(".lrc_content_notext").show(); 7 return; 8 5 return true; 6 if (val == undefined || val == 'undefined') 7 return true; 8
4.6K40发布于 2018-09-10 - 来自专栏视频加密
H5播放器加密、水印功能示例
随着flash播放器的退化，H5播放器占据了主流，方便易用，支持pc和手机端直接打开播放，可扩展更多功能，加密、水印、广告、等都可以实现。 将视频文件加密后，PC、Android、iOS等网页可直接播放，但只能在授权域名下播放，防止用户非法下载、复制、传播。 具体功能如下： 支持MP4、FLV等多种常见视频的加密，可提供可视化加密界面，或者命令行加密工具，以便集成到客户代码中自动调用 加密后视频，在电脑、手机浏览器下（包括QQ、微信）等常见浏览器打开即可播放 播放器外观支持控制换肤。 支持播放过程中弹出题目，须回答题目才可继续。 支持浮动会员ID显示，防录屏。 集成方便 H5播放器动态字幕功能 c 动态字幕H5播放器.jpg H5播放器水印参数设置 c水印参数设置H5.jpg
2.3K40发布于 2020-05-21 - 来自专栏灵简
首个基于西瓜播放器的WordPress m3u8视频播放器插件wp xgplayer
前段时间不是写了基于videojs播放器的插件吗，然后看见有人说国内用DPlayer来搭配的比较多，我就找了下DPlayer，但是找的途中，才看见了西瓜播放器这款产品，是字节跳动旗下的开源产品。 所以我就直接放弃DPlayer，改用西瓜播放器来试了下。 相比之前Wpmvp的播放器插件，功能差不多，但是代码有所不同，因为识别问题，由于我技术不到家，最后只能都改成js了，所以可能会有兼容问题，后续看用户反馈，如果没什么人用就不管了，播放器这个东西其实和videojs 插件功能： 只支持mp4和m3u8视频 支持视频截图 支持多个视频 支持下一集 画中画 短代码 倍速选择 样式全屏 禁用了右键菜单 经典编辑器快捷键 古腾堡编辑器快捷引入 短代码： 单个视频 [xgplayer_video url="视频完整链接"] 多个视频 [xgplayer_video url="视频完整链接1,视频完整链接2"] 截图预览：
9.2K21编辑于 2026-03-04 - 来自专栏用户8739990的专栏
视频播放器有哪些用途？视频播放器有哪些处理流程？
，现在的手机或者电脑上面都拥有专用的视频播放器，那么视频播放器有哪些用途？ 视频播放器有哪些处理流程？下面小编就为大家带来详细介绍一下。 image.png 一、视频播放器有哪些用途？ 视频播放器是一般都是指设备中可以播放文件的软件或者一些电子产品，那么视频播放器有哪些用途？ 视频播放器一般是将文件播放给用户们观看的软件或者电子产品，那么视频播放器有哪些处理流程？ 以上就是关于视频播放器有哪些用途以及视频播放器有哪些处理流程的文章内容，相信大家对于视频播放器已经有所了解了，平时大家也会经常使用到视频播放器，希望小编今天的介绍对大家有用。
4.9K10发布于 2021-06-25 - 来自专栏曾大稳的博客
ffmpeg视频播放器相关
软解码容易造成容易造成音视频不同步。 硬解码：在解码之前判断是否支持硬解码，如果支持硬解码就直接通过ffmpeg处理视频数据H264 H265等，为其加上头信息，然后硬解码交其OpenGLES渲染。 音视频同步问题 音频线性播放，视频同步到音频上。 视频线性播放，音频同步到视频上。 用一个外部线性时间，音频和视频都同步到这个外部时间上。 由于人们对声音更敏感，视频画面的一会儿快一会儿慢是察觉不出来的。而 声音的节奏变化是很容易察觉的。所以我们这里采用第一种方式来同步音视频。 这里需要计算当前视频帧的播放时间和当前音频的播放时间来进行比较，然后计算出睡眠时间来让视频不渲染还是延迟渲染,保持音视频尽量同步。 //如果>0表示音频播放在前，视频渲染慢了，需要加速渲染 <0表示音频播放在后，视频渲染快了，需要延迟渲染 double getFrameDiffTime(AVFrame *avFrame) {
6.3K31发布于 2018-09-11 - 来自专栏TSINGSEE青犀视频
H5网页播放器EasyPlayer.js如何实现直播视频实时录像？
EasyPlayer系列做了整整8年了，从最开始的EasyPlayerRTSP版，到后来的RTMP版、Pro版、js版，受众用户已经不计其数了，希望EasyPlayer能一如既往地优秀下去。 最近，有位用户对我们的EasyCVR提出了一种关于播放器实时录像的需求。按照以往的概念，网页怎么能像C/S客户端那样做实时的视频录像呢？因为浏览器写本地文件几乎是不可能的一件事情。 后端收到前端录像的指令，将要发往前端的音视频数据先预存一份在服务端，当收到前端的停止录像指令后，再将整个缓存的数据，打包封装成MP4，提供给用户下载。事实上，这种方式其实是非常不合理的。 我们的EasyPlayer视频流媒体系列播放器，可支持H.264/H.265视频编码，并拥有多个版本，包括EasyPlayer-RTSP、EasyPlayer.js、EasyPlayerPro等，用户可以根据自身的需求对其进行二次开发或自主集成
3.1K30编辑于 2022-07-06 - 来自专栏音视频技术
8款测试HLS m3u8视频流的免费在线播放器
▲扫描图中二维码或点击阅读原文▲ 了解音视频技术大会更多信息 ---- 播放器 Easy-Tech #030# 通过m3u8播放器测试m3u8视频流和播放清单是使用HLS协议传输媒体的关键一步。 Akamai的免费m3u8播放器界面 当你按下“播放键”，视频开始播放，Akamai的播放器提供了大量有用的信息。你可以在视频播放器右侧查看HLS m3u8文件中的视频切片信息和码率。 Akamai视频播放器提供的最新信息 所有这些信息和统计数据使Akamai播放器成为最受欢迎的在线测试m3u8视频流的播放器之一。 为了测试m3u8视频流，Bitmovin提供了一款免费的m3u8测试播放器。 Bitmovin播放器中的HLS m3u8播放数据 4 JWPlayer的demo m3u8播放器 JWPlayer是一个广受欢迎的视频流媒体平台，同时提供跨平台的视频播放器。
14.7K20编辑于 2022-06-06 - 来自专栏一Li小麦
基于react的H5音频播放器
---- 初步 最近刚好就做了音频播放器的需求，现将踩坑记录如右。 项目是基于React，镶嵌在页面。为此开发了组件audio.js。不过不管什么框架。逻辑都是一样的。 基础界面如下 ? width: 14px; height: 14px; border-radius: 50%; background: rgb(80,172,81); margin-top:-8px audio满足如下特殊属性 HTML 音频/视频重要属性 属性 描述 currentTime（重要) 设置或返回音频/视频中的当前播放位置（以秒计）。 duration 返回当前音频/视频的长度（以秒计）。设置或返回是否在加载完成后随即播放音频/视频。 HTML 音频/视频事件 事件 描述 canplay 当浏览器可以开始播放音频/视频时触发。 ontimeupdate 当currentTime更新时会触发timeupdate事件” pause 当音频/视频已暂停时触发。 play 当音频/视频已开始或不再暂停时触发。
8.7K10发布于 2019-07-18 - 来自专栏全栈程序员必看
qt实现视频播放器
本篇博客介绍如何利用qMediaPlayer和qvideowidget实现视频文件(avi,mp4….)的播放，并且提供进度显示，还可以通过拖动进度条来变换播放位置。 相关代码可以在我的资源里下载”基于qt的视频播放器” pro文件： #------------------------------------------------- # # Project created QApplication a(argc, argv); VideoPlayer w; w.show(); return a.exec(); } VideoPlayer是我定义的播放器窗体类
4K20编辑于 2022-09-06 - 来自专栏iOS开发攻城狮的集散地
iOS AVPlayer视频播放器
GOVVideoPlayer/GOVVideoController 是一个基于AVPlayer封装的视频播放器，支持播放/暂停、左右退拽快进、上下滑动调节音量、自动手动全屏、全屏时横屏Or竖屏、有缓冲进度指示条 、卡顿指示器、切换视频源。 ---- 更新于2017/8/10，增加了GOVVideoController GOVVideoPlayer是在继承于UIView的基础上封装的视频View; GOVVideoController是在继承于 UIViewController的基础上封装的视频视图控制器,用起来更方便简洁，解耦性强，几行代码就足够了。 bufferStart:) name:AVPlayerItemPlaybackStalledNotification object:self.avPlayer.currentItem]; //KOV监控 播放器进度更新
5K40发布于 2018-05-22 - 来自专栏JNing的专栏
Ubuntu: 安装视频播放器
SMPlayer 是个适用于 Linux 下的免费多媒体播放器，内置各种解码器， 有生成视频缩略图，使用音视频过滤器等功能。
4K60发布于 2018-09-28
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号