【译】解决HTML5 MP4(H.264)视频模糊的问题

翻译 2016年08月30日 16:23:10

MP4视频文件是所有主要的现代浏览器都认可和接受的文件格式。如果你想知道具体的支持情况,请查看 Can I Use

但是!当 HTML5视频标签Video 嵌入网页中,如果没有正确配置好你的MP4视频会得到一个模糊图像的视频。发生这种情况的原因是,这种类型的视频和其编码模式有一些具体的要求没有得到正确的处理。

学习使用以下简单的建议将帮助你满足这些需求,将为您的web页面生成你清晰的MP4视频。


建议:

1、如果可以的话,请使用标准的 4:3 或16:9 的视频大小比例请看原因

2、使用大小的倍数4:3或16:9的纵横比和16的倍数(16 x16像素正方形块级区域的编码器)

4:3比例的公式 16:9的宽高比公式
Width: 64*n / Height: 48*n Width: 256*n / Height: 144*n

* 备注:n可以是任何的自然数。


3、如果您已经有一个自定义大小视频和你想要迅速调整为一个完美的看,尝试“MP4视频大小校正器”这个页面上。

附加技巧: 在chrome 浏览器中添加 Hack css 方法

-webkit-filter: brightness(108.5%);

同时使用 .webm.mp4 的文件格式 。(.webm 要放在 .mp4 的前面).


参考文章:

原文阅读:blurry-html5-video

libx264进行视频编码的流程

调用libx264进行视频编码的基本流程图,始化编码器,用x264_param_t设置压缩图片的参数。并使用函数x264_encoder_open打开压缩编码器,返回的对象给en->handle。 x...
  • cc_fys
  • cc_fys
  • 2017年08月03日 19:56
  • 263

web无插件解码播放H264/H265(js解码HTML5播放)

项目意义: 长久以来,安防领域的网络摄像机(IPC)的WEB视频直播都依赖于浏览器插件,IE浏览器使用ActiveX插件,Chrome和Firefox浏览器使用NPAPI插件。 之所以开发浏览器插...
  • Jacob_job
  • Jacob_job
  • 2017年09月28日 13:00
  • 3205

Mp4文件中提取H264码流

一、MP4格式基本概念 MP4格式对应标准MPEG-4标准(ISO/IEC14496)   二、MP4封装格式核心概念 1  MP4封装格式对应标准为 ISO/IEC 14496-12(信息...
  • u013898698
  • u013898698
  • 2017年08月17日 16:55
  • 693

H264码流封装MP4

码流封装使用开源库ffmpeg 通过函数h264buff_write() 向H264 buffer中写入H264码流,mux_thread 会把收到的码流封装进MP4 文件, 这里我采用单独的线程封装...
  • qq_28086637
  • qq_28086637
  • 2016年04月20日 16:00
  • 2360

MP4中提取H.264码流

 1.获取数据 ffmpeg读取mp4中的H264数据,并不能直接得到NALU,文件中也没有储存0x00000001的分隔符。下面这张图为packet.data中的数据 从图中可以发...
  • xiaojun111111
  • xiaojun111111
  • 2016年08月06日 11:26
  • 1423

【VS开发】MP4与H.264

一、MP4格式基本概念 MP4格式对应标准MPEG-4标准(ISO/IEC14496)   二、MP4封装格式核心概念 1  MP4封装格式对应标准为 ISO/IEC 14...
  • LG1259156776
  • LG1259156776
  • 2016年03月01日 16:05
  • 945

【译】解决HTML5 MP4(H.264)视频模糊的问题

MP4视频文件是所有主要的现代浏览器都认可和接受的文件格式。如果你想知道具体的支持情况,请查看 Can I Use但是!当 HTML5视频标签Video 嵌入网页中,如果没有正确配置好你的MP4视频会...
  • dong123dddd
  • dong123dddd
  • 2016年08月30日 16:23
  • 1080

h264 裸流打包成mp4 注意事项

需求: Android 端把网络摄像头的一段正在播放的视频流,截取保存成mp4(按录像按钮时开始录像)。 实现: ffmpeg + x264 + sdl; h264 裸流 打包成MP4,在...
  • wishfly
  • wishfly
  • 2016年03月29日 17:33
  • 3940

视频转gif,视频转gif模糊的解决办法

网址: https://cloudconvert.com/mp4-to-gif步骤 点击 “select files” ,选择一个本地资源(这里是一个mp4视频)如图,选择类似与设置图标的按钮点开后...
  • u010335298
  • u010335298
  • 2016年04月14日 14:52
  • 2165

MP4和H264关系

MP4是容器,H264是编码。 见这篇文章: http://www.cnblogs.com/skyseraph/archive/2012/04/01/2429384.html...
  • ee230
  • ee230
  • 2012年11月22日 09:17
  • 12506
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:【译】解决HTML5 MP4(H.264)视频模糊的问题
举报原因:
原因补充:

(最多只允许输入30个字)