效果很震撼!有电影院的感觉了。呵呵。

看了下代码,依然是 在一个canvas里嵌入<video>然后getImageData

点击这里查看效果

代码:

var canvas = document.createElement('canvas'), 

video = document.getElementsByTagName('video')[0],
ctx = canvas.getContext('2d');
ctx.drawImage(video, 0, 0, video.width, video.height);
var block_width = 50;
var pixels = ctx.getImageData(0, 0, block_width, canvas.height);
//http://www.cnblogs.com/roucheng/

很震撼的HTML5视频播放器,电影院的感觉的更多相关文章

  1. 7款很棒的 HTML5 视频播放器

    做个连接:http://www.cnblogs.com/lhb25/archive/2011/06/27/7-great-html-5-video-player-scripts.html

  2. 打造自己的html5视频播放器

    前段时间重新学习了一下html5的video部分,以前只是停留在标签的使用上,这一次决定深入了解相关的API,并运用这些API打造一个简单的视频播放器.所谓“打造自己的”,就是要自己重写video标签 ...

  3. jqm视频播放器,html5视频播放器,html5音乐播放器,html5媒体播放器,video开展demo,html5视频播放演示示例,html5移动视频播放器

    最近看到很多有用的论坛html5视频播放的发展,音乐播放功能,大多数都在寻找答案.所以,我在这里做一个demo.对于大家互相学习.html5开发越来越流行,至于这也是一个不可缺少的一部分的视频. 如何 ...

  4. html5视频播放器 二 (功能实现及播放优化)

    样式改写css,其中的一些按钮是在“阿里妈妈”上找的字体图标,就不向上传了. /* *CoolPlay视频播放器 * 2016年8月1日 * 627314658@qq.com * */ @font-f ...

  5. html5视频播放器 一 (改写默认样式)

    一个项目用到了html5视频播放器,于是就写了一个,走了很多坑,例如在chrome中加载视频出现加载异常等 先看看效果 是不是感觉换不错,以下是我播放器改写样式的布局. <!DOCTYPE ht ...

  6. 一个很好的开源视频播放器GiraffePlayer2(支持rtmp,rtsp,http,https)

    一个很好的开源视频播放器GiraffePlayer2(支持rtmp,rtsp,http,https) https://github.com/tcking/GiraffePlayer2 GiraffeP ...

  7. Html5视频播放器-VideoJS+Audio标签实现视频,音频及字幕同步播放

    一,VideoJS介绍 引用脚本,videojs很为你着想,直接cdn了,你都不需要下载这些代码放入自己的网站 <link href=”http://vjs.zencdn.net/c/video ...

  8. video.js html5 视频播放器

    我个人感觉很不错 https://github.com/videojs/video.js <head> <title>Video.js | HTML5 Video Player ...

  9. 一个html5视频播放器

    具有播放视频,拖拽,自定义右键菜单,上传头像的功能 <!DOCTYPE html><html lang="en"> <head> <met ...

随机推荐

  1. 关于 Redis 访问安全性的问题

    升级版本 3.0.2 版本升级到 redis-3.2.0 版本远程无法访问,比较配置文件有些变化,比如默认只能本地的机器才能访问 3.0.2 版本 # By default Redis listens ...

  2. 8 个最优秀的 Android Studio 插件

    Android Studio是目前Google官方设计的用于原生Android应用程序开发的IDE.基于JetBrains的IntelliJ IDEA,这是Google I/O 2013第一个宣布的作 ...

  3. JS实现移动端图片延迟加载

    图片延迟加载常见的有,jquery.lazyload.js,原生JS实现的echo.js.但是都是必须给图片设置宽高. 因为项目是移动端,而且无法在加载前知道图片的宽高,所以,只好自己写了一个. 既然 ...

  4. 基于nodejs实现js后端化处理

    今天D哥给我提了个问题,"用php执行过js没"?咋一听,没戏~~毕竟常规情况下,js是依赖浏览器运行的.想在php后端采集的同时利用js运行结果并传递给php使用,没戏! 然后回 ...

  5. SSAS:菜鸟笔记(一)基本思路及操作

    建模思路 创建数据源 Data Source 创建数据源视图 Data Source View 创建数据维度 Dimenstrition 创建数据立方 Cube → 选定要填充的数据内容 Fact 向 ...

  6. 微信、qq时间格式模板

    产品近来蛋疼,时间格式从做完到现在改了四遍了 ,最新的要求如下: * 2分钟内 无显示 * 2分钟-24小时 HH:mm * 昨天 昨天 HH:mm * 前天 前天 HH:mm * 今年 MM:DD ...

  7. SQLite 入门教程 (终端)命令

    一.基本简介 SQLite 是一个自持的(self-contained).无服务器的.零配置的.事务型的关系型数据库引擎.因为他很小,所以也可以作为嵌入式数据库内建在你的应用程序中.SQLite 被应 ...

  8. 2012年中国科学技术信息研究所发布自然科学SCI(E)论文期刊分区列表

    分区 期刊名称 ISSN 学科名称 学科名称(中文) 总被引频次 影响因子 5年影响因子 即年影响因子 被引半衰期 特征因子 论文影响指标 1区 ACM COMPUT SURV 0360-0300 C ...

  9. HTML CSS——margin和padding的学习

    你在学习margin和padding的时候是不是懵了,——什么他娘的内边距,什么他娘的外边距.呵呵呵,刚开始我也有点不理解,后来通过查资料学习总算弄明白了,现在我来谈一下自己对margin和paddi ...

  10. Query Object--查询对象模式(下)

    回顾 上一篇对模式进行了介绍,并基于ADO.NET进行了实现,虽然现在ORM框架越来越流行,但是很多中小型的公司仍然是使用ADO.NET来进行数据库操作的,随着项目的需求不断增加,业务不断变化,ADO ...