未完待续

HTML5相关资源

26 08 2010 No Comments

by 枯藤昏鸦in 就是不分类 Tags: CSS, HTML5, JavaScript

参考资料

HTML5 Readiness : Visual timeline of HTML5 feature support.
When Can I Use… : Up to date HTML5 feature browser support reference.
HTML5 Test : Series of browser tests to evaluate feature support.
HTML5 Infographic : A quick overview of scope and support.
W3C HTML5 Web Author View : Lightweight version of the W3c spec, perfect for web developers.
Chrome Implementation Status : Follow the engineering effort for cutting edge support from the Chrome team.
Dive into HTML5 by Mark Pilgrim : Learn HTML5 and have a laugh at the same time.
HTML5: Comparison of Layout Engines : If the Wikipedia says it then it must be true.
Safari HTML5 Guides : Excellent WebKit-oriented development documentation.
Mozilla Development Center HTML5 Reference : Excellent documentation and guides.
WhatWG Web Apps Spec (HTML5 plus the kitchen sink) : Working draft spec of everything under the larger HTML5 umbrella.
ECMAScript 5 table : Detailed table of ES5 support across browsers.
Compatibility Tables : Results of DOM and CSS properties tests in major browsers.

相关工具
Modernizr : Javascript library for feature detection and control fallback cases of HTML5.
html5 shiv : Javascript patch to make IE support, and print, the new tag elements.
CSS Button Maker : Preview CSS buttons with a fancy interface to play with the parameters.
CSS3 Generator : Preview CSS buttons with a fancy interface to play with the parameters.
CSS3 Sandbox : Test and get the code of the fanciest CSS features.
CSS3 Gradient Generator : Generate CSS code for gradients on the fly.
CSS3 Please : Use CSS3 without having to worry about xbrowser differences.
Font Dragr : Test your fonts using drag and drop.
Font Squirrel Generator : Most complete tool to generate code for you font-face support.
Let’s make the web faster : Complete list of tools related to web performance.

社区
HTML5 Watch
CSS3 Watch
HTML5 Doctor
WhatWG Blog
HTML5 Demos
Ajaxian
Chromium HTML5 Discussion Group
Mozilla Hacks
Safari HTML5 Demos
Test Drive IE9 Demos
Open Web – Opera Developer Community
Chrome Experiments
-EOF-

HTML5之自动聚焦域

21 06 2010 1 Comment

by 枯藤昏鸦in 就是不分类 Tags: HTML5

在要自动获得焦点的表单域上放置autofocus属性即可，比如：

1
2
3
4

<form>
  <input name="q" autofocus>
  <input type="submit" value="Search">
</form>

如果需要向下兼容一些老式浏览器，让他们也可以获得焦点，下面的代码比较实用：

1
2
3
4
5
6
7
8
9

<form name="f">
  <input id="q" autofocus>
  <script>
    if (!("autofocus" in document.createElement("input"))) {
      document.getElementById("q").focus();
    }
  </script>
  <input type="submit" value="Go">
</form>

-EOF-

HTML5之占位符文本

20 06 2010 No Comments

by 枯藤昏鸦in 就是不分类 Tags: HTML5

HTML5中的占位符文本就是平时我们用JS做的鼠标悬停说明（input hint）。使用起来也很简单，完全向下兼容。下面的代码是一个使用示例：

<form>
  <input name="q" placeholder="Search Bookmarks and History">
  <input type="submit" value="Search">
</form>

给input加上placeholder属性即可。HTML5中该属性值只能填写文本。点击这里查看你的浏览器是否支持占位符文本。
目前支持占位符文本（Placeholder Text）的有Firefox3.7+、Safari4.0+、Chrome4.0+。
-EOF-

畅游 HTML5 （DIVE INTO HTML5 中文版）

16 06 2010 3 Comments

by 枯藤昏鸦in 就是不分类 Tags: HTML5

从年后开始一直都在说要翻译这本书，的确是在断断续续的翻译，但总是没时间校对，拖了很久。这个端午假期搞好了第零章，先放出来，第一二章已经翻译好等待校对。就像作者一样，翻译这本书每完成一个章节便放出来，整本书预计今年九月翻译完成。由于这是我的第一次翻译，错误难免，还请发现问题的朋友多多指教。
以下是译文存放地址，欢迎评阅：
DIVE INTO HTML5 中文版
-EOF-

HTML5新功能演示

29 04 2010 1 Comment

by 枯藤昏鸦in 就是不分类 Tags: HTML5

这是一个HTML5新功能的演示文档，几乎包括HTML5所有激动人心的新功能的简介和DEMO。
IE系列浏览器无法浏览，firefox、opera等浏览器只能使用部分功能，如果想100%演示成功，请使用最新版的“谷歌浏览器（Google Chrome）”，建议使用最新版。

中文版演示文档请看此处：http://ioio.name/html5/html5_zh_CN.html
中文原版：http://directguo.com/html5/
英文原版：http://apirocks.com/html5/html5.html
英文镜像：http://ioio.name/html5/html5.html
-EOF-

DIVE INTO HTML5离线版下载

03 03 2010 No Comments

by 枯藤昏鸦in 就是不分类 Tags: HTML5

MARK PILGRIM这次给我们带来了DIVE INTO HTML5，虽然这本书还在写作之中，但是我想对HTML5感兴趣的同学已经迫不及待的想要阅读了。与MARK PILGRIM之前所写的DIVE INTO PYTHON一样，这本书同样采用CC协议发布，同时你还可以使用Mercurial从版本库中检索出来的。

1

hg clone http://hg.diveintohtml5.org/ diveintohtml5

如果你机器上没有Mercurial，我这有一份已经打包好的供下载DiveIntoHtml5.tar.gz (210)。
-EOF-