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

看了下代码,依然是 在一个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. Linux 求文件交集 差集等

    使用comm命令 假设两个文件FILE1和FILE2用集合A和B表示,FILE1内容如下: a b c e d a FILE2内容如下: c d a c 基本上有两个方法,一个是comm命令,一个是g ...

  2. 使用 CountDownLatch 控制多个线程执行顺序

    已同步更新至:http://dxjia.cn/2015/08/countdownlatch-use/ 有时候会有这样的需求,多个线程同时工作,然后其中几个可以随意并发执行,但有一个线程需要等其他线程工 ...

  3. Quartz 2D绘制简单图形

    在Quartz 2D中,绘图是通过图形上下文进行绘制的,以下绘制几个简单的图形 首先先创建一个QuartzView.swift文件继承自UIView,然后实现drawRect方法: import UI ...

  4. github 使用记录

    安装客户端tortoiseGit 是服务端,要想在自己电脑上使用git我们还需要一个git客户端,我这里选用TortoiseGit,他给我们提供了图形界面的操作.在安装之前首先需要安装git,下载地址 ...

  5. Java 部分排序算法

    . import java.io.*;import java.math.*;import java.util.*;public class Algr{ public static int array[ ...

  6. 20+功能强大的jQuery/CSS3图片特效插件

    以下是分享的20几个不错的图片特效插件,基于jQuery和CSS3. 1.jQuery图片下滑切换播放效果 这是一款基于jQuery的焦点图插件,这款焦点图的特点是有向下滑动的动画效果,滑到底部时,有 ...

  7. 高性能优化Web前端

    高性能HTML 一.避免使用iframe iframe也叫内联frame,可将一个HTML文档嵌入另一个HTML文档中. iframe的好处是,嵌入的文档独立于父文档,通常也借此使浏览器模拟多线程.缺 ...

  8. string-->wstring-->string

    std::string src("三毛三毛三毛三毛三三三三流浪记"); size_t size = mbstowcs(NULL,src.c_str(),0); std::wstri ...

  9. log4net使用的关键点

    <configSections>     < section name =" log4net" type="log4net.Config.Log4Net ...

  10. python 字符串查找

    python 字符串查找有4个方法,1 find,2 index方法,3 rfind方法,4 rindex方法. 1 find()方法: )##从下标1开始,查找在字符串里第一个出现的子串:返回结果3 ...