近期开始自己做菜了~~o,yeah~~

作者:kun10 发布时间:February 18, 2010 分类:记生活

DSCF2288.png
笋条带鱼~~
DSCF2285.png
川葱炒响铃~~

新年的计划

作者:kun10 发布时间:February 14, 2010 分类:记生活

虎年来到了,祝各位虎年大吉~~~虎虎生威
同时,更重要的是,新的一年给自己定一些大方向的目标
1、努力做好毕业设计
2、能够拥有一款比较得意的电子产品(itouch?)
3、成为一个会做饭的人 (*^________^*) 不能饿着~~
4、成为一个合格的scripter(目标:寻觅一个合适的工作)
5、能够培养起理财的观念~~
6、努力压榨公司老板\(^o^)/~,(前提:通过努力的工作)
大体是这些目标,后期会不断commit

margin-left和display的一点故事

作者:kun10 发布时间:February 12, 2010 分类:CSS

前几天qq上面突然响起了小崔急促的问好,说是问我display:inline-block是什么效果,我自己当然不常用过此属性,很严肃地告诉他,“百度一下,谷歌一下,自己再试试”。
当晚,自己做到一个行内的span标签,想给这个span标签定一个高度和宽度,想到了block,不过一想此属性一设定如果不float:left的话岂不是又要换行了。于是,又联想到某次看960.gs系统里面grid定义的时候都用到了display:inline,但是此span本身毕竟不具备div的默认属性,所以光用inline可能还是定不了高度和宽度,于是我想到了inline-block,最后果然奏效,inline-block的用途由此可见。
另一件事就是margin-left,以前经常听同事提起它,同时还会提到ie6,这厮的margin-left默认要是别人的两倍,真不好伺候,一直以来我也会常常以padding-left去代替margin-left,不过自从上次的960.gs事件之后,我决定换一种思路,因为960.gs这套系统里面的margin-left从来没有写过浏览器兼容性相关的多余代码,让我很费解,后来细看看明白了,如果给元素加一个display:inline,再定义margin-left,是可以使ie6两倍的毛病消除的。原来就是这么简单,百度了一下也发现此法早有介绍,惭愧啊惭愧~~


----- add on 2010/2/19 ------
display:block;定义后元素将能够定义高度和宽度
display:inline;定义后元素将能够被外界的text-align:center所控制,
定义display:inline-block;元素将能够具有以上两种属性
---------------------------

demo:margin-left和inline-block

评价量规

作者:kun10 发布时间:February 10, 2010 分类:老本行

什么是量规?

量规是一个真实性评价工具,它是对学生的作品、成果、成长记录袋或者表现进行评价或者等级评定的一套标准。同时也是一个有效的教学工具,是连接教学与评价之间的一个重要桥梁。
量规具有什么样的特征?

一般量规至少都具有三个要素:
1. 一是评价准则,指决定表现性任务、行为或作品质量的各个指标;
2. 二是等级标准,说明学生在表现任务中处于什么样的水平。
3. 三是具体说明,描述评价准则在质量上从差到好(或从好到差)的序列,评价准则在每个等级水平上的表现是什么样的。

为什么要使用量规?


使用量规具有以下的好处:
1. 可以帮助教师和学生定义“高质量”的学习,使学生明确学习的要求和目标;
2. 可以清楚的显示评价学生学习的方式和教师的期望,同时让学生清楚“如何做”才能达到这些期望;
3. 可以使用具体的术语澄清标准,同时使评价标准公开化,降低评价的随意性,使评价更客观、公正;
4. 帮助学生比较深入的思考和判断自己作业的质量,同时减少了“我还要做什么?”的问题;
5. 减少教师评价学生作业的时间,并且更容易向学生解释,为什么他们得到这个等级和他们做什么可以获得提高。
6. 不但可以由教师评价学生学习,而且可以让学生自评或同学互评。
7. 可以经过修改重复使用,评价多种类型的学习活动。

如何应用量规?


1. 在学习任务开始之前提供量规,发挥量规对明确学习预期的目的和对学习过程的指导作用;
2. 呈现量规的同时,最好给学生提供学习的范例;
3. 在适当的时候使用量规,并与其他评价工具配合使用;
4. 充分利用量规促进学生自评和互评。
5. 在学习过程中,不断的提醒学生注意量规的要求,对有问题的地方及时提供反馈。

如何从头设计一个量规?


HeidiGoodrichAndrade(1997)对量规的设计提出了5个步骤:
第一步:观看若干例子。向学生展示一些好的和差的作品。说出好的之所以好的特征,差的之所以差的特征。
第二步:列出评价标准。从讨论例子开始,列出一系列优秀作品的必要特征。
第三步:把所选择的评价标准分为不同的质量级别,并一一陈述之。先描述最好的和最差的一级,然后描述中间的级别。
第四步:通过让学生评价第一步中的例子,让他们实践最初的标准。并要学生问一些澄清性的问题,要他们对自己的评价发表评论。
第五步:运用问题和评论来修改评价表。

设计量规时应该注意的问题


1.要根据教学目标来设计量规的不同准则;
2.用具体的、可操作的语言清楚的描述量规;
3.尽量让学生参与到设计量规的过程中来。
4.根据需要选择量规的形式和类型。

一个好的量规是什么样子的?


1. 量规中有关学习过程和成果的说明是可以被测量的吗?
2. 量规涵盖了学生成就的不同水平吗?评价准则是否反映了目前评价内容的重要观点?
3. 不同等级水平之间有明确的划分依据吗?能否说明一个学生的表现或成就属于“A”而不是“B”等级水平
4. 量规能够适用于不同的评分者,不同的教师对量规中的评价准则和等级水平的划分标准是否达到共识?
5. 量规能被学生和家长清楚的理解吗?
6. 量规是否明确说明适合于什么阶段的学生发展水平?
7. 量规能够应用于多个任务吗?
8. 量规是公平而无偏见的吗?
9. 量规是有用的、可行的、可实施的吗?量规能够记录需要的和有效的学生信息吗?
10.量规的等级水平划分的数目合理吗?

取消chrome输入框高光的办法

作者:kun10 发布时间:February 7, 2010 分类:CSS

一直用typecho,用着用着,发现自己的系统的输入框总和高手们的有不一样,一看输入框,chrome下面带的高亮框怎么没有了。以前曾经费劲心机想去掉的。于是在系统的css文件一点点的寻找。终于在reset文件里面找到可疑的这一段

/* remember to define focus styles! */
:focus {
	outline: 0;
}

这一段就可以去掉chrome的输入框有焦点时的高光,没想到就这么简单。
----------- added on 11th Feb 2010 --------
同样的方法可以去掉超级链接的虚线外框来着,IE8, FF3+, Opera, Chrome等都支持(感谢Mac)
--------------------------------
记一记免得自己忘掉。

js变量作用域--虚惊一场

作者:kun10 发布时间:February 7, 2010 分类:JavaScript

昨晚写毕业设计的原型写的比较晚,一晚就容易出现奇怪的东西。
我定义并执行了这么一个函数

(function(){
        var aa = document.getElementById('aa');
        aa.style.width = "20px";
}());

不知哪里来的想法,以前从没有测试过变量作用域的我,打算测试一下aa变量在函数后是否存在。
不测不知道一测吓一跳,
没想到在chrome,ie678下面居然alert(aa)都可以返回一个htmldom元素

(function(){
        var aa = document.getElementById('aa');
        aa.style.width = "20px";
}());
alert(aa);//returns an HTMLDOMObject

但是ff下面浏览器却报aa is undefined
这是怎么回事呢?我越发的困惑了。。。
于是拿出以前的代码再看

(function(){
        var bb = document.getElementById('aa');
        bb.style.width = "20px";
}());
alert(bb);//所有浏览器都报错,bb未定义

哦,这下明白了,原来在除了ff以外的浏览器都支持用id直接访问window对象下面的id为那个值的对象
说的有点绕么?
也就是第一段代码中后面alert的aa不是原来的那个aa,匿名函数内的aa仍然在外界看不到,但是外界直接使用aa也会指向id为aa的dom元素。但是火狐下面这一条行不通
记一下这一点希望大家在测试程序的时候别犯浑,同时也提醒我们在命名变量的时候要注意其名称的选择

转-小时候作文必杀句(有点怀念有点搞笑)

作者:kun10 发布时间:February 5, 2010 分类:瞎扯

不知道现在的小孩子,还会不会用这些句子呢……

1.“同学们看着清洁的教室,擦着额头上的汗水笑了……”(用于描写大扫除之后)

2.问:“小朋友,谢谢你,你叫什么名字?”(用于扶老人过马路等好人好事之后)
答:“我叫红领巾。”( 黄金必杀句~~~)

3.小明,小红,小刚,小李,小X……

4.“今天天气晴朗,万里无云,我们来到了XX公园春游。首先映入眼帘的是假山。。”

“在夕阳的余晖下,我们依依不舍的离开了XX,我会永远记得这快乐而有意义的一天!”
(为什么每次春游回来都要写周记?)

5.“我爱我的家,更爱我伟大的祖国!”
“望着缓缓升起的红旗,我的崇敬之情油然而生”

6.“买东西的时候阿姨多找了2角钱。低头看到胸前飘扬的红领巾,就退回去了。”
再然后就是:我低下头,发觉胸前的红领巾更加鲜艳了 。

7.“今天是我第一次洗衣服,今天是我第一次洗碗,今天是我第一次叠被子,今天是我第
一次。。。” (第一次果然都很有纪念价值)

8.“在我的记忆里,有这样一段故事有如最亮的星星一般…”

9.“我的脚象灌了铅一样。。。。”

10.“下课了,有的……,有的……,还有的……。我们的课余生活是多么的丰富啊!

11.无数革命先辈抛头颅洒热血,才换来了我们今天的幸福生活,和他们比起来,我的心里
惭愧极了……” “五星红旗,是用烈士的鲜血染红的。”
(童年过的真血腥 — —)

12.一天,小强走在上学的路上,一天,王老师骑在下班的路上。。。又是**的一天。

( 好平静的一天。。。)

13.每当遇到困难想退缩时,脑海中忽然闪过XX(张海迪大姐姐等)的身影,比起她我的这
点困难算什么。 (显然那时候我们跟他们是完全不认识的,怎么这么爱装熟?)

14.十一届三中全会以来。。。

15.烛光下,看着妈妈布满老茧的手那么灵巧的帮我织毛衣,我的泪水再也忍不住流出来”

16.红的像火,粉的似霞,白的胜雪!

17.举例子…..牛顿…..爱因斯坦…..居里夫人…..爱迪生……
(让老师吐血的举例四大名人)

18.不经历风雨,哪得见彩虹? /若非一番寒彻骨,哪得梅花扑鼻香?
(描写毅力常用句式。。)

19.怀念我们的老师。。。今天是教师节,老师们是蜡烛,燃烧自己,照亮别人。
他们是“灵魂的工程师”。古诗云:春蚕到死丝方尽。。。。。”
那天。小王老师使尽了全身的力量和我们上最后一节课。。。。可是小王老师只教了我们
一个学期就患癌症死去了。。我们是多怀念他啊。。。。(小学时为了感人,很多老师就
这样患绝症死了)

20.今天路上捡了1毛钱,交给了**叔叔。。心里别提有多高兴了。。老师也表扬了我,
乐得我一蹦三尺高(顶级经典!)。毛主席说:做一件好事并不难,难的是天天做。。。

21.在灯光下,看着妈妈的白发,我。。。。泪流满面。。我一定要。。。。
(80后的妈妈们基本30多岁就都长白发了)。。。。

22.小红是我的同桌,清秀的眉毛下一双水灵灵的大眼睛,仿佛会说话一般……
(只要是写眼睛,水灵灵的准没错。。。。)

看着既搞笑又怀念,就转了这篇来自普加邻友的日志

SVN总算弄完了,用了很土很土的办法

作者:kun10 发布时间:February 4, 2010 分类:记生活

搞了将近一天的svn,哎,为了一个checkout命令,反复删了3个错传的目录,郁闷了半天。
今天一共开了两个svn,这样子自己维护自己的博客会方便不少,同时开的另外一个svn为自己的毕业设计做准备用,呵呵。
后来一铁心把原来的在线版本给删了,重新co了一下,总算是搞好了,功能倒也还都在,不过心里到觉得听忐忑的,怕错删了什么,难怪当时修改地图的时候,研发经理那么严肃的问我“非要上传么?想好了再告诉我”原来弄错会很麻烦~~~
不过,从探索的过程中,发现SVN可以在本地使用,通过使用file协议就可以。还是得到了意外的收获吧。。
当然仍然留有疑问,原来的目录里面有网页的文件,此时这个目录还没有checkout过,当使用co的时候会提示文件已存在,不知道大家有没有比删除原目录更好的方法呢?我觉得或许co后面加一两个参数就可以了,不过自己没有找到。知情者可以留言,呵呵。

《PPK谈JavaScript》读书笔记 --可用性

作者:kun10 发布时间:February 3, 2010 分类:JavaScript

很早就买了ppk的这本书,在还不知道taobaoUED的时候就买了,当时也没有看得很明白,只是看到一些关于用户可用性的东西,觉得很不错,很快就用上了。下面就总结一下用户可访问性的规则:

1、条理分明的HTML

在脚本环境下面要保证可访问性的最显而易见的方法就是确保纯HTML页面包含了成功浏览所需要的“筋骨”,
内容、导航和重要的内容的表单都应该被硬编码(hard-code)到HTML中,这样,无论发生了什么,任何的用户都可以访问并使用它们。
这样,当浏览器不支持JavaScript的时候,会降低一些页面的易用性,但是其基本的功能不会被破坏。

1.1、硬编码的连接必须有href

你的html中任何的一个硬编码的连接都应该拥有一个href属性,他指向一个有用的页面或是其他的文件,因此这样是错误的

 <a href="#" onclick="showPopUp('niceimage.png')">Nice Image</a>

当一个无脚本的用户点击了这个连接,什么也不会发生,
坏例子
对此,我还要严重的批评一下山东毕业生就业信息网,它对于学生给出的就业意向,信息网给出了一些相关的推荐的岗位,但是居然利用了弹出窗口的方式,并且居然没有html硬编码,最可恨的就是他的javacript出错了,导致的问题就是这些学生非常需要的信息学生根本就不能访问,点击后只是提示javascript错误,也没有弹出窗口,也没有打开连接(所以说,真不知道是哪个没头没脑的家伙做的。如果是硬编码的话,至少有点技术的用户还可以分离出里面的html连接来访问这些信息)
相反,一个清醒的javascript的开发者会这么做

<a href="niceimage.png" id="nice">Nice Image<a/>
document.getElementById('nice').onclick = function(){
     showPopup(thie.href);
}

现在,无脚本用户沿用被硬编码的href属性,而脚步用户会打开一个弹出窗口(popup),网站保持了可访问性,而且把行为从结构里面分离了出来。

2、产生对脚本用户有意义的内容

在某些情况下,javaScript中产生的内容使网页更具有可访问性,

2.1、触发高级脚本的链接

假设你有一个链接,点击它将启动一段漂亮的Ajax脚本。这段脚本会获得内容并执行其他有用的任务。但是你没有一个合适的HTML页面可以让这个链接指向它。我们刚才已经看到了,这样是不对的

<a href="#" onclick="startUpAjaxStuff()">我拿代码耍耍酷</a>

我们不能仅仅应用上一条规则(1.1),如果没有明显的于Ajax脚本等效的无脚本替代品,我们改把href指向哪里呢?
如果给链接加上一条href不可行,那么就用JavaScript来生成连接

var link = document.createElement('a');
link.href = "#";
link.onclick = startUpAjaxStuff();
var linkText = document.createTextNode('这回可以耍酷了');
link.appendChild(lintText);
document.body.appendChild(link);

如此一来,无脚本的用户就完全看不到这条连接了,这样很好,因为否则他点了这个连接却发现什么反应也没有,他会很困惑的。
注意,上面的例子把链接的href的属性设置成了'#',虽然我们知道使用#作为href通常不是一个好主意,但是我们需要它,因为绝大多数的浏览器定义一个超连接即使一个拥有href的a元素
幸运的是,在这种情况下,上一条规则并不适用,因为我们只是让支持JavaScript的用户看到了这个链接。能看到这条连接的用户,其浏览器一定支持onclick事件,所以href为#并无大碍。

2.2、用Javscript隐藏内容

隐藏内容是危险的。一般来说,隐藏的内容是你认为如果不立即显示可以提高页面可用性的内容。直到用户点击了页面里面的什么的时候,内容才显示出来。
如果没有JavaScript,内容就永远不会显示,而且这个页面就不具备可访问性,如果你创建了一个隐藏内容直到用户激活一段脚本的时候才显示,那么你应该始终用JavaScript来作这件事情,而不是在CSS中
有时候直接定义这样的css是不好的

 .importantContent
    {
       display:none;
    }

如果一个无脚本的用户访问你的页面,他将不会看到这些所谓的重要的信息,因此这个页面的可访问性就降低了,我想,一些页面所呈现的重要的信息,比如一些公告,应该设置css的时候就设定为display:block,然后用javascript去控制其隐藏和显示。,不过你在此处有什么反驳咱们可以探讨一下~~~
值得一想的例子
----例子----
Google的英文首页,在页面中定义了一个mousemove事件。这个事件只在用户的浏览器支持JavaScript的情况下面会工作(是上一个要点的范例),但我想说的不只是这个,这个鼠标移动事件会使得页面中除了主搜索框以外的一些部分显示出来,如果你不移动鼠标,而直接输入内容,使用的只是搜索框和搜索按钮,不过大多数的用户都是好动的,当他们移动了自己的鼠标的时候,页面上角如google邮箱,阅读器之类的服务连接都显示出来了,个人觉得这是很好的一种体验,不管怎么说至少晚一些运行了javascript。

----例子结束----

3、重定向用户

有时候,解决可访问性的问题就是为你的网站创建一个有脚本的版本和一个无脚本的版本。我不喜欢这个解决方案,显得很不帅。。。但是,就算不怎么帅,他还是很有实用价值的。
如果你使用的是这种方法,就应该遵循两点:
首先,你网站的入口应该是一个无脚本的页面(ppk这么说,其实我觉得到不一定就要做到纯无脚本,而是说做到无脚本可访问就可以,硬编码的什么的必须做到,这样其实第二条我们都可以不管了,很多时候我们应该在一个无脚本可访问的页面的基础上面去创建更好的可用性),这样,所有的浏览器都可以正常的访问;
第二,当浏览器到达这个无脚本页面,启动一段脚本来使得页面跳转到有脚本页面。我们在这里用replace来进行跳转。

<head>
<title>NoScript Page</title>
<script type="text/javascript">
var isSupport = [检测是否支持javascript的代码];
if(isSupport){//如果支持
    location.replace("scriptpage.html");//最好是不要用location.href来做,原因见下面
}
</script>
</head>

如果在这里,你用了location.href,那么,它会在浏览器的历史记录里面建立一条浏览记录,如果用户到达无脚本页面,他就被跳转到了有脚本的页面,然而,一旦他点击了浏览器的后退按钮,就会被送回到无脚本的页面,而上述的跳转代码又被启动,他又被送回有脚本页面(这不是折腾用户是什么?)
location.replace则会覆盖掉原来的页面,用户点击后退,会回到无脚本页面前面的那个页面,这也正好让后退按钮的功能给发挥出来了。所以,不管ppk说的这一部分靠不考谱(我是指把页面分为有脚本和无脚本两个版本的做法),我们都应该知道尽管有些功能效果很相近,但是,不乱用功能,是很重要的一件事,从选好replace和href方法做起。

4、键盘用户

我们已经看到了键盘用户不会发生鼠标事件(除非他们同时使用屏幕阅读器),因此,应该说你应该总是定义鼠标事件的替代方案。有时候这很简单,比如,把mouveover事件和focus事件配对。有时候则会困难些,比如一个托放事件,你就必须编写其他的函数来迎合键盘用户。

4.1、可点击元素

即使你创建了完美的键盘解决方案,如果用户不能把焦点移动到那些元素上面,那也是没有用的,(貌似有点废话阿,咱创建键盘事件不就是等待用户焦点移动来触发的么?但是我们要想的一个问题是用户是否能够将焦点移到元素上。)
我们设想一个下拉菜单,他使用mouseover事件来触发显示下一级的菜单,根据上面的原则,我们添加了focus事件,然后,为了触发focus事件,键盘用户必须把焦点落到下拉菜单上面,如果这一点做不到,那么脚本很明显是不可访问的。
在所有的浏览器中,可以可靠的获得焦点的元素只有链接(带有href的a)、表单域以及按钮(经过测试opera下面的表现很垃圾,都不想说啥,我的版本是9.64,居然不支持tab切换链接。。。)。因此,任何键盘友好事件都应该被设置在这几种元素上面。

5、<noscript>标签

浏览器厂商意识到开发者也许想提供特殊的内容给那些没有javascript解释程序的用户,他们发明了noscript标签。
noscript标签的工作如下所述
1、不支持任何javascript的浏览器不能识别这个标签,因为未知的标签会被HTML解释器忽略。这些浏览器会显示这个标签的内容。或许这里这和浏览器的渲染模式还有一定的关系。
2、支持javascript的浏览器会检查javascript是否背启用了。如果是,他们就从视图中隐藏这个标签的内容,否则就显示标签中的内容
我觉得这样的工作没有什么太大的用处,我基本不用这个标签~~~

开启typecho之旅

作者:kun10 发布时间:February 3, 2010 分类:杂七杂八

感谢typecho给我这个机会,感谢godaddy卖给我这个域名,感谢oncoding提供的空间,等贴上墙纸,刷上油漆,我的狗窝就做好了~~转了几篇以前记录的东东先

  1. 1