昨天远图哥说是有这么个小需求,于是我就顺手做了一个,很简单的时钟,呵呵.
用到了这么一个图片:

这是最终效果,右击可以查看源代码

下面是一个用flash实现的同样的时钟：

js · 时钟

    var aa={
        bb:"bb",
        cc:"cc"
    },bb;
    for(var i in bb=aa){  //在某些场合下可以使代码变得简洁
        alert(bb[i])
    }

之后我会多写点这种无聊的博客,没时间长篇大论了,只好记录一点简单的东西

js

原文实在太长,没时间翻译完,我整理了一下,把重要的部分总结了下…

delete · js · 理解

1.基础:本次分析原理就是在各个浏览器下input内容变化的时候触发事件的各种不兼容性.在ie下用onpropertychange事件,在其他浏览器里用input事件.

2.用例:对每个浏览器分别测试如下的情况:

–输入英文字母时–开启输入法时–大小写不同时–输入运算符时–按下tab键时–输入法中按下空格时–按下控制键时–复制粘贴时–删除文本时–等等

3.测试开始:(只标出特殊情况,没标出的表示正常触发,每次只触发一次事件)

chrome:+开启输入法时,可以捕捉到输入事件.+开启输入法的时候按下空格键,触发两次事件,猜测一次是空格触发的,一次是输入法改变输入框里的文本时触发的.+开启输入法的时候,按下空格后,立即按下大写锁定,此后所有的输入事件都会被触发两次,原因不知.+没有开启输入法的时候,方向键不会触发事件,但是开启输入法后,方向键可以触发事件.+剪切和粘贴都会触发事件.+tab键不处罚事件,开启输入法时,按tab键触发事件.+按住shift和其他键(例如:数字键),每输入一个字符触发两次事件.

Firefox:+开启输入法时,不能扑捉到事件,但是按下空格时,可以触发两次事件.+任何时候方向键都不触发事件.+开启输入法的时候,按下空格后,立即按下大写锁定,此后所有的输入事件都会被触发两次,原因不知.+按下tab键的时候不触发事件.++Firefox页面刷新的时候内容会被保留在输入框里.+按住shift和其他键(例如:数字键),每输入一个字符触发两次事件.

opera:+正常情况下,在输入框里按下tab键会触发一次事件,但是此后只要不刷新页面,tab键都不会再触发此事件.+开启输入法后不会触发事件,开启后,方向键和tab键都不触发事件.+开启输入法时,按下空格只触发一次事件,不会出现触发两次事件的情况.+粘贴的时候触发事件,剪切的时候不触发

ie:+输入法不会触发事件,按空格也都是只触发一次,方向键任何时刻都不触发.+刷新页面的时候内容会留在input里,而且注意,不管input是不是空的,刷新页面后自动触发一次事件.

3.总结.

就一句话,差异很大.

注意input事件可以用在chrome,Firefox,opera里,但是只能用 addEventListener绑定,不能用ontype形式,而onpropertychange可以用on形式,也可以用attachEvent绑定

input · js · 兼容性 · 输入事件 · 输入框

年前,某次分享会上听玉伯偶然说了这句话,当时糊里糊涂,不明所以,偶然有一天我做一个东西,发现某个对象的实例之间竟然会互相操作了定义在prototype里的属性,于是我验证了下:

var objA=function(){

}
objA.prototype={
	name:{},
	setName:function(str){
		this.name=str;
	},
	getName:function(){
		return this.name;
	}
}
var a=new objA();

var b=new objA();
//a.name={firstname:"孙",fathername:"信宇"};//undefined
a.name.firstname="孙";//弹出sun
alert(b.name.firstname);

在这个例子里,当我修改实例a的name属性的时候,实例b的name属性页跟着变了,而且说明他们引用了同一份对象.
如果name属性是值类型,例如字符串,就不会与这种问题了,那是因为字符串每次被操作都返回新实例,当然反映不出冲突来了.
那为什么会出现这种冲突呢?
专业术语我不太会讲,但是prototype这种原型继承的好处其实就是节省程序运行空间,当你从objA实例化两个实例:a和b时,并不会创建两份属性和方法,而是把他们都指向一份属性和方法,所以prototype里的所有的东西都被所有的实例共享,实例中保存的只是一个json索引.
正因为如此,如果整个改变name的值的话,让他指向别的对象,这样就不会互相影响了,而且对于值类型来说,本质就是每次操作都会返回新的实例,所以不会出现冲突.
对于这种冲突来说,最好的解决办法就是将属性从prototype里移出来,写在构造函数里:

var objA=function(){
	this.name={}
}
objA.prototype={
	setName:function(str){
		this.name=str;
	},
	getName:function(){
		return this.name;
	}
}

这样再试一次就会发现,每次创建实例都会创建一个新的name属性对象,而不是指向同一个对象;
也可以在prototype理的init方法里用this.name={}来初始化配置参数,属性等内容,反正就是不能写在prototype里面.但是可以在函数里初始化定义.

还有一点要注意:我个人认为,js里所有的东西都是对象,包括值类型,他们之所以表现出非引用类型的性质,是因为每次对这些对象操作都会返回新的实例,这只是一种假象,事实上可以说,js里所有的东西都是引用类型,只是值类型在被操作时引用总是被改变,表面上来看就是非引用类型了.
觉得不对的可以加群:46532005 讨论

js · prototype · 值类型 · 引用

朱 照华, 程序员, 自由职业者

2009 年 11 月 19 日

本文介绍了使用 Cufon 进行网页字体渲染的一般方法和技巧，并以此为基准，介绍了 Cufon 技术的主要实现原理和这一原理的可能应用领域

这是一篇关于 Cufon 技术的小文章。什么是 Cufon 呢？简单的说，Cufon 是一个用来替代 sIFR 框架，实现在网页中对文字字体进行渲染功能的纯 JavaScript 开源类库。

那么为什么要使用 Cufon 呢？这要从 Web 开发人员，所经常面对的一种“冲突”，即“字体（Font Family）冲突”开始讲起。

通常的这一冲突总是爆发于 Web 页面的设计者（Designer）和开发者（Coder）之间。在很多场合下，Web 页面的设计者都会倾向于在他们的页面设计稿中，为文字附加使用一些“特殊”的字体和特效，以此来展示他们卓越的设计能力。

如下图 1 所示，是某设计者为公司 A 所设计的一个公司简介页面（部分）。在其中为了突出公司的“亲和力”，设计者使用了一种名为 Baroque Script 的手写字体。

无疑的这一设计将会让开发人员“抓狂”。因为与此同时，A 公司雇主明确的告诉了开发人员，公司简介的内容需要可以通过后台管理程序进行修改，并实时的显示到相应的页面上。

这也就意味着，即使开发人员可以如下代码所示通过编写脚本，来实时输出公司简介的内容，并指定这一内容使用“Baroque Script”字体进行显示，也是无法“完美”的实现设计初衷的。

 <style>
  .introduction { font-family:'Baroque Script';}
 </style>
……
 <p style="font-size:36px"><?php echo $introduction; ?></p>
 <p style="font-size:24px; text-align:right">
 <?php echo $leader;?></p>

因为在大部分的浏览器上，并不会安装有 Baroque Script 字体。因此在这些浏览器上系统会主动“忽略”掉代码中关于 font-family 的说明，转而使用缺省字体进行输出，如下图 2 所示。

当然随着 Web 标准的发展，关于这一问题现在也已经有了一个“官方”的解决方案，那就是通过 CSS3 标准下的 @font-face 属性来指定和引入非缺省字体，如下代码所示。

……
 @font-face {
  font-family: "Baroque Script";
 src: url('BaroqueScript.ttf')
 }
……

完整的实现则可以参考范例 1.htm。显然的，这一解决方案会成为今后在此类问题上一个主流的处理方法。但是不幸的是，截止到目前为止其却并没有获得很多浏览器，尤其是 IE 系列浏览器的完整支持。而与之相较本文所将介绍的 Cufon 方案，目前在“普适性”上较 @font-face 方案则是要广泛许多，下表 1 则给出了二者在浏览器支持方面的一个比较，以供读者参考。

那么面对这一冲突，Cufon 究竟是如何解决非缺省字体显示的问题的呢？

回页首

引入 Cufon

作为一种基于 JavaScript 的网页字体引入方案， Cufon 的核心功能是通过一个名为“cufon-yui.js”的 JavaScript 类库，提供给开发人员的。因此使用 Cufon 技术的第一步，当然就是在 Web 页面中引入这一类库，如下代码所示。

 <script src="cufon-yui.js" type="text/javascript"></script>

创建并引入字体文件 (全文…)

html · js · 字体 · 网页

话说以前我转过一片文章,讲的是 JavaScript中||和&&的妙用,网址是

http://www.cnblogs.com/mars-bird/archive/2009/10/23/1588406.html

第一段代码就是强调一下这个用法,我在我的项目中使用了一个switch,后来我发现这样的代码好丑,于是我就写成||&&形式的,

后来测试性能的时候,发现性能竟然上了一个数量级,可见这种写法在某些情况下可以增加性能,但是我并不确定是何种情况才能提高性能,因为我测试在通常情况下switch和||&&的性能是差不多的.

原来的代码:

switch(this.now_char=this.str.charAt(this.index)){
                    case "/":
                        if(this.handleNote()) continue;else this.str2+=this.now_char;
                        break;
                    case "\"":
                    case "\'":
                        if(this.handleStr()) continue;else this.str2+=this.now_char;
                        break;
                    case "\n":
                        if(this.handleLine()) continue;else this.str2+=this.now_char;
                        break;
                    case "{":
                    case "}":
                        if(this.handleDepth()) continue;else this.str2+=this.now_char;
                        break;
                      case ":":if(this.handleJson()) continue;else this.str2+=this.now_char;break;
                    default:
                        if(this.handleKeyword()) continue;else this.str2+=this.now_char;
                        break;
 }

改写后的代码,功能当然是一样的

(this.now_char=="/"&&(this.handleNote()||(this.str2+=this.now_char)))||
((this.now_char=="\""||this.now_char=="\'")&&(this.handleStr()||(this.str2+=this.now_char)))||
(this.now_char=="\n"&&(this.handleLine()||(this.str2+=this.now_char)))||                       ((this.now_char=="{"||this.now_char=="}")&&(this.handleDepth()||(this.str2+=this.now_char)))||
(this.handleKeyword()||(this.str2+=this.now_char))

我嚼的第二种写法更简洁点,||&&还有很多用处,可以看那篇文章的介绍

第二段代码是利用了一个特性:

(ele=document.createElement(“div”)) ;//这个表达式会返回一个dom元素,赋值的同时会把值返回给外边的括号

于是出来下面这段代码 :

var mixin=function(target,options){
        for(var i in options){
            target[i]=options[i]
        }
    }
    var ele=null;
    mixin(ele=document.createElement("div"),{
        id:"aa",
        className:"bb",
        innerHTML:"sss"
    })
    document.body.appendChild(ele)
    debug(ele.id)//aa
    debug(ele.className)//bb
    debug(ele.innerHTML)//sss

这段代码是因为我实在厌烦了建立一个dom元素的时候的一大堆语句:
var ele=document.createElement(“div”)
ele.id=”aa”;
ele.className=”aa”
ele.innerHTML=”sss”
等等等等,好烦啊.
于是出来了上面的代码.
用上面的原理还可以这样写代码
(ele=document.createElement(“div”)).className=”aa”;
感觉是不是节省了一点空间呢,上面这句话节省了一个变量名,呵呵.

&& · js · || · 技巧

为什么写这篇文章

这几天被一个省市菜单纠结了,测试给我提了N多bug,都是关于省市联动菜单的,大家就省市菜单到底应该具有何种行为持有各自的异议,特别是我,跟大家观点都不同,当然也有不少常识性的行为被我忽略了,下面是我这几天的bug列表,其中大部分都是关于这个联动的,当然js上联动实现起来也不难,这里讨论的不是技术细节,不讨论如何实现,只讨论联动到底应该怎样才能让用户感觉自己在使用一个自然而然的产品.

我这个联动组件是在淘宝里使用的比较普遍的一个联动,不知道为什么问题还这么多,特别是我刚拿过来的时候,可用性极差.样式如下:

先不说这个组件有什么不好的,一个联动组件至少应该有这些基本的行为才能符合人的习惯:

(1),让用户一眼就可以看出这是一个做什么的组件.

(2),让用户在很短的时间内就可以熟练操作这个组件.

(3),可以保证用户的任何选择都不会引起数据的逻辑错误.

这是基本的三条,上面这个组件首先不符合第一条,不要因为我们一看就知道这是一个联动组件就行了,要把自己想象成一个从来没见过这种组件的电脑白痴,他第一次看到这个组件会认出来么,如果我是个电脑白痴,我会不会试着去点第二个和第三个下拉列表呢?然后才知道第一个可以点?看到的第一眼,如果我不做任何操作,我会知道这是干什么的么?

显然上面这个控件做不到这一点,他只是在旁边做了一个文字指示,但是用户仍然会困惑,特别是有三个下拉框,应该先点击哪个呢?会出现什么结果呢?

下面是点击第一个下拉菜单后的样式

选中省后,市出现了,但是第一个元素是空的,仍然没有指示下一步该做什么,其实世界上有很多人对此会手足无措,即使大部分人知道应该去点第二个,下拉后才会看到市的选项.

我们来做个改变吧

这样的组件不知道为什么被其他项目采用了,反正我们这个项目里,大家对这个组件很有意见,大家都踊跃提出意见,造成我的bug数目急剧上升,改了又改,大家还是不满意.

总结下吧,应该让联动菜单有哪些行为呢?

(1)需要在三个联动菜单中显示三个默认值,来引导用户,让他看一眼就知道这里是让你选省市区的,开始我们定的是显示三个”请选择”,后来觉得还是不够明了,分别改成了”省份”,”城市”,”区(县)”,这样用户看到这个组件的时候至少知道这里原来是用来选省市区的呀.我们把空白替换成了省份,城市和区(县)

(2)选择省后,城市下拉里填充元素,但是仍然显示一个城市给用户,而不是设置默认的市,这是为什么呢?有人说默认的省市区可以让用户更省力,可是上面说过了第三条我们要保证数据的准确性,不能设置任何默认值,以便获取尽量真实的用户地址,如果设置了默认的地址,用户直接点确定,当然这里是搜索,不需要太准备的数据,但是如果是在设置的地方,一定不能设置默认值

(全文…)

js · 可用性 · 省市 · 联动

+ 按照惯例，demo在此独立浏览，这样显得更直观。

+ 以前做谷歌的小工具时，api里提供了一个很有用的函数，那就是在程序运行时可以使层动态随内容大小而变化，而且是平滑变换，在一些jquery的lightbox里也普遍有这种效果，看起来很酷的样子。

+ 下面我们就自己来实现一个这样的组件，没有参考其他资料，纯属自己瞎写。

+ 我觉得我这个方法很简单了，只需要在外边多套一个层就可以，而且可以容纳大量的文字（为什么这样说？因为如果只是单纯的图片，那调整起来简单多了，而如果有一大串文字的话，要变换两次才可以，因为如果你改变了宽度的话，字会被挤得高度增加，这里有两个方法来调整，一个是每次动画循环都更新最新的高和宽，另一种方法就是先变换，变换完后再检查一次，这次变化的只是高度，也就是调节两次，第一种方法效果好，但是每次都更新，自然加重了负担，第二种效果差点，但是性能好，而且也不是那么差）

+ 实现原理很简单，就是在外边放一个主体层，我们调整的就是这个层，我们首先把这个层设置一个很小的宽和高，然后设置其overflow为hidden，然后运行时判断里面内容的大小，再回来调整外部层的大小即可。

+ 本程序用到了YUI的一个动画函数和一个淘宝sns的jsonhtml对象，这个对象的作用是将一个用json形式表示的html转换成真正的html结构，可以使构造html的程序简洁清晰。

+ 主体从Tip开始,我将这个组件写成了单例的模式,也就是不用new就可以在任何地方使用,而且都指向一个对象,而且这个组件封装目前没优化,为了试验,里面很多东西都是直接改的,外部暴露的接口太少:

 var Tip=function(){
                    //直接返回一个json对象,这是一种js单例模式的实现
                return {
                    //初始化函数
                    init:function(options){
                        this.config={
                            container:null,//包装容器
                            style:{},//样式配置
                            data:{}
                        }
                        //样式配置
                        this.style={tip:null,tip_title:null,tip_pic:null,tip_bd:null}
                        //混合配置选项
                        mixin(this.config,options)
                        //初始数据
                        this.data={
                            //标题的数据
                            hd_data:this.config.data.hd_data==null?"没有描述":this.config.data.hd_data,
                            //图片数据,正常情况下应该是一个网址
                            pic_data:this.config.data.pic_data==null?"#":this.config.data.pic_data,
                            //主题内容数据
                            bd_data:this.config.data.bd_data==null?"没有描述":this.config.data.bd_data
                        }
                        //这是定义了一个加载的时候显示的滚动的gif的图像
                        this.loading_pic=new Image();
                        this.loading_pic.src="http://www.sj33.cn/sc/UploadFiles_6888/200803/20080320132838323.gif";
                        this.creatHtml();//调用html构造器
                    },

+ 关于为什么js写成这样,还有一些从某些库里学来的写法就不多解释了,注释也很清楚,这里就是初始化一些数据,用来给后面的程序处理.
(全文…)

js · YUI · 动态改变大小 · 动画 · 滑动

+ 接触真正的前端开发差不多有一个月了,真正在公司哦日子也只有两个周,从工资就可以看出来,这个月工资总共才600,加上补贴才1100大洋,哎…… 这么长时间,对前端也算有了基本的了解,也熟悉了一些工具,我现在天天用的工具也就下图这么多:

+ 其中大多数是早先就一直在用的,最近接触的是aptana IDE和Dreamweaver而已,但是其他几个工具以前只是偶尔用一用,现在却每天摆在桌面上,因为发现他们有很多实用的功能.

+首先是ide,前端的ide很多很多,用的最多的当属Dreamweaver吧,虽然我从来不用dw,但是淘宝前端里很多人用这个,我同事跟我说这个效率高,我以前用过一段时间的eclipse,因为php和as的官方编辑器都是eclipse,js和html也都支持,可是那插件实在是太弱智了,所有代码都基本是手写,根本没有提示啊,大纲啊,tips啊之类的,不过这样有个好处,可以使之牢固地记住单词拼写.后来netbeans再java圈里活了起来,一个东西火起来总有它的好处,虽然还处在早期开发版,但是很多功能已经让人爱不释手了,例如我最喜欢的一个:代码格式化,在eclipse里必须要插件支持格式化,才能格式化,在netbeans里,格式化被原生支持,所有代码都基本可以格式化.还有netbeans的配色特别舒服,代码着色特别漂亮,而且对JavaScript的支持有明显提高,智能提示很智能,各种自动补全都比eclipse人性化,例如:在netbeans和eclipse里输入括号或者引号的一半时,都会自动关闭,但是如果要删除后面的那一半括号呢?在eclipse里,不管上下文是什么都会把前一半一起删除掉,而在netbeans里,会判断前后文,判断你为什么想删除后半个括号,如果是本来就存在一个后半括号的话,则只会删除要删除的后半括号,而不会把前半个括号一起删除.

+ 最近听人说aptana这个ide不错,也支持我喜欢的ruby,而且对js和html,css支持也很好,我比较来比较去,还是喜欢netbeans,首先因为netbeans里有个插件,可以把着色的代码复制粘贴成html+css,而是代码着色aptana不好看,自己配又配不出感觉来,netbeans的界面也比较清爽,至于js提示,其实我从来就没用到过高级的提示,在netbeans里我只需要他在我输入document.的时候出来后面那一串get什么什么的就行了.js已经是够简洁的语言了,提醒太多反而没什么意义,不过在netbeans里的YUI提示和我看的YUI不是一个版本的,全是错的,但是我还是喜欢netbeans多一点,其实编程这东西效率很难说高和低,思路理清楚了,自然效率高.程序写的很快的话,代码提示很智能的话,反而太依赖,对思路理解不深刻,写着后面忘了前面,效率反而慢了.
(全文…)

aptana · colorschemer studio · eclipse · ide · js · netbeans · picpick · 前端 · 开发工具 · 淘宝

这次的任务需要用到脚本了,我们要实现一个任务栏的东西,页面上所有的container层都可以最小化到这个任务栏的层中,如果本来的层是绝对定位的(position:absolute),则最小化之后再次恢复到原来的状态时,会回到原来的位置,而如果本来的层是相对定位的(positoin:relative),则层不会记住原来的位置,因为它是流动的,每次恢复状态的时候,层都将加入到文档流中,随着文档流变化,所以对于绝对定位的层来说这种最小化更具有意义.

具体效果可以去看我的博客(用firefox或者chrome浏览)我的博客主题被我改成了wave了,而且可以最小化层:

http://www.coderbbs.cn

本文demo请见:http://www.coderbbs.cn/UED/google-wave-test.html

大家可以去体验一下google wave,目前需要邀请才能使用,我这里还有6个邀请名额,可以留言给我.

前面一篇文章已经实现了布局,但是不支持ie,虽然我的博客(http://www.coderbbs.cn)经过改进,支持了ie,但是这次加了脚本后,ie再次出现布局问题,我决定放弃ie,直接给出chrome的链接.虽然用ie7可以浏览本站,但是看不到这篇文章描述的效果,脚本被我屏蔽,ie8可以看到效果,但是有布局bug.等有时间了我再解决.

我估计google wave一上线,ie的大限就到了,chrome市场份额必将大升,不过wave占用内容超高

我们接着上次,这次要实现层的最小化,并且让所有的层都最小化到一个任务栏里,而且是可以恢复原状的,我们首先要布局出最小化后的层的样式,用到了三个新的图片:

前三个是新的圆角和边框,后面的貌似是空白的其实是标题栏右上角的几个按钮,因为是白色的,所以看不到效果,图片都是png,ie6不支持.

下面就要考虑怎么最小化某个层了,而且我们要保存它的位置和大小信息,以便可以恢复原来的样子.

恩呵呵,我首先想到的就是设置两种样式,一种是正常的样式,一种是最小化后的样式,正常的样式叫做”container”最小化后就叫做”container-min”,我将容器中的所有的样式都设置两份,一份是正常的样式,一份是最小化后的样式.例如:w-bd,是主体内容的样式,我修改后,分别在css中定义.container .w-hd和.container-min .w-hd,其中前一个是正常的样式,后一个则设置display:none;其他各个圆角和边框均设置两套,然后我在js中切换className.

例如:下面是点击最小化按钮后执行的函数:

var min_handle=function(){
	    this.parentNode.className= this.parentNode.className.replace("container","");
	    if(this.parentNode.className.indexOf("container-min")==-1)
		this.parentNode.className+=" container-min";
	    min_stack.add(this.parentNode)
	}

意思就是我首先将层的className中的container去掉,然后换成container-min,后面检测了一下,确保只加入一次,ok就是这样简单,无需其他操作,这时候层就最小化了.再加个最大化的点击函数:

var max_handle=function(){
	    this.parentNode.className= this.parentNode.className.replace("container-min","");
	    if(this.parentNode.className.indexOf("container ")==-1)
		this.parentNode.className+=" container";
	    min_stack.remove(this.parentNode)
	}

然后绑定一下事件,现在所有的层都可以最大化和最小化了,效果还不错来着.那么上面函数里的最后一句是什么呢?

别忘了,我们要最小化到任务栏,而不是原地不动.min_stack是一个单例对象,承载着一个任务栏的角色,他的构造如下:

var min_stack=function(){
	    return {
		stacker:new Array(),
		parent_stacker:new Array(),//记住父元素
		str_stacker:new Array(),//记住初始标题字符串
		container:document.getElementById("min-stack"),
		now_width:0,
		width:140,
		x_count:0,
		add:function(ele){
		    var boo=false;
		    for(var i=0;i
7) Dom.getElementsByClassName("w-hd","div",ele)[0].innerHTML=hd_html.substr(0,6);
		    }
		},
		remove:function(ele){
		    for(var i=0;i

它有两个方法:add()和remove(),顾名思义,add就是将一个元素添加到任务栏,remove就是移除一个元素;

这里面我们做了一些特殊的工作,当add()一个元素的时候,我们首先判断是不是已经添加过此元素了,防止出错,然后我们记住它的父元素,之后恢复的时候就可以将其送回父元素里面,然后我们清楚了它的位置信息,这一步很重要,每个元素都有本来的位置,我们将其添加到任务栏的时候要清除这些样式,我们用添加一个clear_position的class的方法来覆盖位置信息,之后我们可以移除此class来恢复位置信息,之后我们把层从其父元素里移出来添加到任务栏里,设置特殊样式,然后去掉最小化按钮,增加恢复按钮,之后我们将标题字数限制为6个,并记住标题信息.之后可以恢复.

在这里我们记住了很多东西,之后都可以恢复,然后层就可以回到原来的样子了.

其实就是这样简单.脚本很少,以至于我都不想封装了,直接写出来.呵呵

下一步,我想研究下所见即所得编辑器,前几天开碳酸饮料会的时候讲到的,既然有人讲到就去研究研究.

chrome · css · google · ie · js · wave · 任务栏 · 最小化 · 阴影