我想网

有不少wBox的用户反映iframe时候不可以自动撑开高度，今天在无意中看到了司徒正美的一片关于iframe自适用高度的js代码，感觉不错，转载来了。

var adjustIframe = function (id) {
    var iframe = document.getElementById(id)
    var idoc = iframe.contentWindow && iframe.contentWindow.document || iframe.contentDocument;
    var callback = function () {
        var iheight = Math.max(idoc.body.scrollHeight, idoc.documentElement.scrollHeight); //取得其高
        iframe.style.height = iheight + "px";
    }
    if (iframe.attachEvent) {
        iframe.attachEvent("onload", callback);
    } else {
        iframe.onload = callback
    }
}

(全文 …)

Tags: HTML
Posted in HTML 评论关闭

IE条件注释是一种特殊的HTML注释，这种注释只有IE5.0及以上版本才能理解。比如普通的HTML注释是：

<!--This is a comment-->

而只有IE可读的IE条件注释是：

<!--[if IE]> <![endif]-->

“非IE条件注释”：

<!--[if !IE]>--> non-IE HTML Code <!--<![endif]-->

“非特定版本IE条件注释”（很少用到）：

<!--[if ! lt IE 7]><![IGNORE[--><![IGNORE[]]>Code for browsers that match the if condition<!--<![endif]-->

简而言之，除了“Windows上的IE”之外的所有浏览器都会认为条件注释只是一段普通的HTML注释。你不能在CSS代码中使用条件注释。IE 条件注释是很有用的对IE隐藏或者展现特定代码的方法，比起在CSS中用诡异的_/制造bug，利用IE条件注释来写CSS “hacks”是更合理的方法。通俗点，条件注释就是一些if判断，但这些判断不是在脚本里执行的，而是直接在html代码里执行的。
(全文 …)

Tags: HTML, IE
Posted in HTML 评论关闭

久没翻译。英语水平本就不高，不敢乱译。博客不能再荒芜下去了，只能硬上。还好这篇我感兴趣，又对CSS有一些了解，有错大家多多指正。
—————————————————————–正文———————————————–
了解基本的id选择器，类选择器和子选择器，如果就此收手，那你会错失很多灵活方法。虽然本文提及的部分选择器属于CSS3范围内，只在一些时新的浏览器 有效，不过还是有必要记得这些选择器。

1. *

* {
 margin: 0;
 padding: 0;
}

在提到更先进的选择器之前，为初学者之便，先把常见的选择器解决掉。
星号符会选择页面每个元素。很多开发者用它把所有margin和padding归零。这当然是快捷测试方法。不过我建议你不使用它，它给浏览器带来太多的 负担，这不必要。
通配选择器也可以用到子选择器上。
(全文 …)

Tags: Browser, CSS, HTML, IE
Posted in Browser, CSS, HTML 评论关闭

HTML, JavaScript,CSS 等等，这可不是你妈口中的AJAX

Web pages are written in HTML, the web programming language that tells browsers how to lay out and present content on a web page. In other words, HTML provides the basic building blocks for the web. For a long time, those building blocks were pretty simple and static: lines of text, links and images.

众所周知，网页是用超文本标记语言（HTML）编写的，这种网页编程语言告诉浏览器怎样在网页中输出并 展现内容。换句话说，HTML就是网页这个建筑的一砖一瓦。长期以来，这些“砖瓦“都相当简单而且是静态的：仅有几行文字，或一些链接，或几张图片。

Today, the web goes beyond just text, links, and images. We expect to be able to play online chess or seamlessly scroll around a map of our neighborhood, without waiting for the entire page to reload for every chess move or every map scroll.

而今，网页中远不止文本，链接 和图片了。我们期望能够在线下象棋时，每走一步不必等待网页重新加载，或者查看一下我们周边的地图时，每拖到一下网页也不用重新刷新。

The idea of such dynamic web pages began with the invention of the scripting language JavaScript. JavaScript support in major web browsers meant that web pages could incorporate more meaningful real- time interactions. For example, if you’ve filled out an online form and hit the “submit” button, the web page can use JavaScript to check your entries in real-time and alert you almost instantly if you had filled out the form wrongly.

这些动态网页的创意开始与于脚本语言JavaScript的出现。主要的 网页浏览器都支持JavaScript，这就意味着网页能够加入一些更有意义的实时互动。例如，当你在线填一些表格时，点击“提交“按钮，网页可以调用 JavaScript代码来实时检查表格是否填错，如果有错误，网页马上就能提示你。
(全文 …)

Tags: CSS, HTML, JavaScript
Posted in Ajax, CSS, HTML, JavaScript 评论关闭

Flash和HTML5都是目前WEB应用上最新的技术，不过HTML5的运用需要浏览器厂商们的支持，但是FLASH就不一样了。今天的分享：50个展示HTML5特性的演示。希望你可以从中体会到HTML5的力量。

1. Tunneler

(全文 …)

Tags: HTML, Website
Posted in HTML, Website 评论关闭

使用 HTML5 的 Canvas可以搞出一些很有趣的东西，如2D图形，位图，动画等。而使用Javascript来操作这些东西，可以设计出很多的小游戏。 下面是一些用 HTML5做出来的小游戏，让我想得了我小时候的那些游戏。

顺祝大家中秋节快乐！以及进入史上最混乱的长假调休。呵呵。

Sinuous

小心被红点撞上。

(全文 …)

Tags: Game, HTML, HTML5
Posted in HTML 评论关闭

又10款令人惊奇的 HTML5和javascript效果，今天网游的时候，又偶然踫到的这几款很不错的效果。回到几年前，这些效果是根本不可能实现，只能用Flash做，但是现在，已经很轻松的就可以实现 了。
之前也发布了几篇此类的文章，但觉得这几款效果确实很让人难以割舍，它们奇幻、炫丽，还是收藏了和大家一起分享吧。:-p
等会，大家要记得用高版本的一些浏览器哦，要不看不到效果的，我用的是Firefox3.5.11。

个人非常喜欢Breathing Galaxies和FlowerPower，真得很炫，你喜欢 哪款呢？
(全文 …)

Tags: HTML, HTML5, JavaScript
Posted in HTML, JavaScript 评论关闭

function replaceHtml(el, html) {
var oldEl = typeof el === "string" ? document.getElementById(el) : el;
/*@cc_on // 原始的 innerHTML 在 IE 中的性能好一点
oldEl.innerHTML = html;
return oldEl;
@*/
var newEl = oldEl.cloneNode(false);
newEl.innerHTML = html;
oldEl.parentNode.replaceChild(newEl, oldEl);
/* 一旦我们从 DOM 上移除老的元素，则返回新的元素引用。*/
return newEl;
};

可以直接用el=replaceHtml(el, newHtml)代替el.innerHTML=newHtml。
(全文 …)

Tags: Browser, Firefox, HTML, Source-code
Posted in Browser, HTML 评论关闭

速查表是帮你记住东西的有效工具。Web设计师和开发者经常使用的快捷键简表会使他们在网上的工作效率大大提高。

事实上，速查表就是来帮助我们把日常中最常用到的信息聚集起来，方便使用，使我们做工作时更有效率。有了它们，免去了你的大脑花额外时间去记忆它们的烦恼——你只需要打开简表，马上能查到你想要的信息。

这篇文章里，你可以看到最实用的HTML，CSS，JavaScript速查表，它们可以当作参考资料，备忘录，能帮助你以最快的速度找到想要的信息。

看看这些简表是不是你想要的，请在文章下面留下你的建议，谢谢！

HTML

HTML帮助手册

(全文 …)

Tags: Cheat-Sheets, CSS, HTML, JavaScript
Posted in CSS, HTML, JavaScript 1 条留言 »

//zxx:以下为翻译全文，本着语言生动和本土化之原则，内容有编辑

注意：每周有那么几次，此列表会更新一些新的窍门，最终，本文会成为超级有用的资源。
//zxx:丑话说在 前头，我可没功夫更新，所以，即使到您女儿出嫁那天，本文还是28项内容。

前端的发展如此之迅猛，一不留神，大侠你可能就会被远远地甩在后面了。如果你不想被HTML5的改变/更新搅得不知所措的话，可以把本文的内容作为必须了解的热身课程。

一、新的Doctype

//zxx:”doctype”中文意思指“文档类型”
仍在使用麻烦的，不可能记得住的XHTML文档类型？
(全文 …)

Tags: HTML, HTML5
Posted in HTML 评论关闭