HTML5
Horky
爱探索、爱技术!简单地快乐着!
展开
-
39个让你受益的HTML5教程
闲话少说,本文作者为大家收集了网上学习HTML5的资源,期望它们可以帮助大家更好地学习HTML5. 好人啊! 不过,作者原来说的40个只有39个,因为第5个和第8个是重复的。原文在此!1. 五分钟入门HTML5 (Learn HTML5 in 5 Minutes!) By Jennifer Marsman毫无疑问,HTML5是一个热门话题。如果你需要一个迅速了解HTML基础的速成翻译 2012-08-04 23:51:33 · 76246 阅读 · 11 评论 -
掌握HTML5中的多媒体--视频(video)
除非你一直生活在一个偏远的岛屿上,过去一年左右的时间,你应该已经听说过HTML5的各式炒作。HTML5将重塑富Web应用的未来。下面 Figure 1的示例展示了HTML5中video标签与传统的object标签的不同.Figure 11. section>2. h1>使用HTML5的video标签播放视频h1>3. videosrc="video1.翻译 2012-08-06 01:33:37 · 24079 阅读 · 3 评论 -
2017 前端性能自查表
Smashing Magazine在年底做了一个有意义的事,把最新的Web性能优化实践做了盘点,这里提供其中大部分内容的翻译,供大家参考。有很多我自己也没有深入学习的点,翻译也不能保证准确,所以有时间还是看原文。翻译 2016-12-26 13:37:36 · 3746 阅读 · 0 评论 -
页面性能的基础因素 - 《Designing for Performance》
考虑页面性能可以从两种场景,第一个场景也是因素最多的场景,即首次访问。第二个场景则是重复访问,缓存将起决定性作用。浏览器厂商为页面开发者提供了很多工具和插件,比如Chrome DevTools, YSlow和PageSpeed Insights。原创 2016-03-07 02:06:42 · 3690 阅读 · 1 评论 -
Webkit中HTML5 Video的实现分析(五) - WebKit中视频事件的传递
HTML的每个元素都可以让JavaScript在某些事件发生时,进行处理。就比如onclick="clickButton()"之类的属性设定。像下面这篇博客所讲的一样,在WebKit中每个元素都有其对应的JS绑定的实现:[WebKit]为JavaScript Binding添加新DOM对象的三种方式及实作对于视频元素,可以对应看看JSHTMLMediaElement原创 2012-10-22 00:15:41 · 8032 阅读 · 1 评论 -
网站HTML5视频问题汇总
最近一直在处理HTML5视频相关的问题,以下是一些和各个视频网站与HTML5 Video相关的问题(不是针对Flash视频):优酷在清晰度切换时的事件处理不当优酷在视频下面的清晰度切换时,在JavaScript中会重新呼叫this.video.load()加载视频,但问题在于video的abor和errort处理函数会在WebKit内核的浏览器中造成递归调用。因为出错后,又再次尝试进行加载原创 2012-10-18 23:04:19 · 5816 阅读 · 1 评论 -
Webkit中HTML5 Video的实现分析 (四) - 视频加载及播放的时序图
MediaPlayer同MediaPlayerPrivateInterface,再同播放控件的交互过程应当要简单、清晰。MediaPlayer通过自身的状态(Network States 和 Ready States)来控制操作的步骤。MediaPlayerPrivateInterface具体到不同的平台和视频格式,使用的具体的播放控件会不同。这里仅贴一张时序图,其中没有特别区分HTM原创 2012-08-21 23:45:13 · 15804 阅读 · 1 评论 -
Webkit中HTML5 Video的实现分析 (三) - MediaPlayer & MediaPlayerPrivate的生命周期
明确主要类的生命周期有助于更好理解Webkit中视频的工作流程。下图展示了类间的引用关系。如HTMLVideoElement与一个MediaPlayer对应,MediaPlayer与MediaPlayerPrivate一一对应,它们都是一个组合关系,当所有者自身被析构时,会自动释放引用的实例。这个过程都是使用OwnPtr智能指针来实现的。 OwnPtr赋值操作的代码:原创 2012-08-17 01:00:59 · 10396 阅读 · 0 评论 -
Webkit中HTML5 Video的实现分析 (一) - 基本结构及HTMLMediaElement & MediaPlayer
以下为针对Webkit中HTML5 Video实现原理的分析和学习总结。至于其中的UML图档,可以到下面的github链接中下载。首先预览一下Webkit中和Video相关的主要的类的层次结构:其中主要的类为HTMLMediaElement, MediaPlayer以及RenderVideo(左下角).HTMLMediaElement代表了DOM结点,其继承关系可以追溯到Nod原创 2012-08-11 23:14:05 · 21820 阅读 · 3 评论 -
Webkit中HTML5 Video的实现分析 (二) - MediaPlayerFactory & RenderVideo的绘制操作
MediaPlayerFactoryMediaPlayerFactory像是一个解码库一样,初始化时,各个可用的播放器(MediaPlayerPrivate)向它注册。当需要解码时,由它给出一个合适的播放器(呼叫MediaPlayerPrivate::constructor,即MediaPlayerPrivate::create)创建一个实例[由MediaPlayer:: loadWith原创 2012-08-14 00:11:51 · 14178 阅读 · 2 评论 -
HTML5 Video/Audio网页信息汇总
基础: HTML5视频简介 (CN,2012) Introduction to HTML5 video - Opera Dev (En,2010) 所有你应该了解的有关HTML5 Video和Audo的那些事 (En,2010) Working with Media in HTML5 Getting Started - Navigating H原创 2012-07-30 23:19:15 · 2983 阅读 · 0 评论 -
10件开发者和老板都要知道的HTML5的那些事
1. HTML5 标签没什么大不了的.理解这句话你需要先了解HTML 5。它仅仅是一个html4.01的一个升级版本?或者是它是完全不同的新版本(无处不在的大肆宣传可能会让你有这种感觉)?答案是两种理解都有部分正确。HTML 5包括许多简化和附加的网页标记,所以称它为升级版本也是公平的(虽然也有一些大的补充标签,如视频和画布)。但是,HTML 5也可以被认为是一个技术组合,包括翻译 2012-07-27 00:11:49 · 4216 阅读 · 0 评论 -
推荐一个HTML5视频转换工具
在开发过程为了便于测试,经常需要准备些视频,于是找到了这一款轻便的转换软件, Easy HTML5 Video。它可以很方便视频转转换为HTML5的三种格式和Flash格式,并可以为你生成一个简单的页面。Windows和Mac都有相应的版本。当然,转出来的视频有水印。但做测试已经够了。官网地址:LINK原创 2012-08-10 22:28:17 · 5662 阅读 · 0 评论 -
掌握HTML5中的多媒体--音频(audio)
使用音频标签音频标签的使用和视频是非常相似的:指定多个音频文件,浏览器会播放其中支持的第一个。1. "audio.ogg" controls>2. 你的浏览器不支持标签.3. audio> Figure 5列出了所有可用的属性. 因为不需要像视频播放器那样显示整个控件,所以高、低和预览图(poster)都不再需要了。Fig翻译 2012-08-08 22:10:17 · 5167 阅读 · 0 评论 -
Web业务性能优化技术总结
Web业务的性能优化是一个系统工程,既有深度,又有广度。以下所简称性能均特指Web业务性能。 技术的广度上,主要从大背景下考虑到其各个相关方,基于共同的数据指标发掘和评估方案。 技术的深度上是一个渐进和迭代的过程。可以从性能的本质展到目前各端的主要优化方向。原创 2017-03-18 01:00:25 · 2932 阅读 · 2 评论