PbootCMS教程
html5教程
CMS教程
网页设计
bootstrap教程
扁平化设计
手机网站教程
HTML5动态
css3教程
前端设计

HTML5 Canvas & Video实例

时间：2014-12-10

这是HTML5中Canvas技术与Video技术结合的实例。效果图：

以下代码不能运行，只提供学习查看。若想预览该实例请浏览http://html5demos.com/video-canvas
（浏览器支持：只支持Safari, Firefox）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Dizzy</title> <style> * { margin: 0;} body { font-family: helvetica; padding: 10px; } input { width: 50px; } /*video, canvas { display: block; }*/ p { margin-top: 20px;} </style> </head> <body> <video height="360" width="480"> <source src="dizzy.mp4" /> <source src="dizzy.ogv" /> </video><canvas></canvas> <p> <input type="button" id="play" value="play"> <span id="position">00:00</span> / <span id="duration"></span> </p> </body> </html>
提示：可修改后代码再运行!

上一篇：HTML5 Canvas实例 下一篇：HTML5 Canvas模拟loading实例

有关HTML5页面在iPhoneX适配问题这篇文章主要介绍了有关HTML5页面在iPhoneX适配问题,需要的朋友可以参考下
html5中canvas图表实现柱状图的示例本篇文章主要介绍了html5中canvas图表实现柱状图的示例，本文使用canvas来实现一个图表，小编觉得挺不错的，现在分享
Adobe Html5 Extension开发初体验图文教程Adobe公司出品的多媒体处理软件产品线较多，涵盖了音视频编辑、图像处理、平面设计、影视后期等领域。这篇文章主
基于HTML5的WebGL经典3D虚拟机房漫游动画这篇文章主要介绍了基于HTML5的WebGL经典3D虚拟机房漫游动画,需要的朋友可以参考下
html5实现移动端适配完美写法这篇文章主要介绍了html5实现移动端适配完美写法,需要的朋友可以参考下
HTML5响应式（自适应）网页设计的实现本篇文章主要介绍了HTML5响应式（自适应）网页设计的实现，小编觉得挺不错的，现在分享给大家，也给大家做个参考

HTML5 Canvas & Video实例

相关文章

最新文章

HTML5 Canvas &amp; Video实例

相关文章

最新文章

HTML5 Canvas & Video实例