刘钢的博客 – 我是UED

昨天参加了第四期 WEB标准化交流会 将收获总结下
讨论会地点是在Sina的一号会议室 感谢sina的友情赞助 到场的嘉宾还有 豆瓣：张克军 百度：月影 新浪：赵立元 和火狐中国的同学
这是我第一次参加这个会议 貌似目前前端的会议也不是很多 昨天对于W3CTech会议还有一个重要的意义 就是北京 上海 广州 三个地方同时在开 也象征着 前端工程师的规模 和地位 越发的重要了,也更期待着下次的会议 与大家一起交流~共同进步

说说具体的吧：昨天的话题分为2个阶段 1.javascript 2.html5+CSS3

总结一下：
第一个阶段 由几位嘉宾先讲了一下 我听得有些糊涂 可能昨天的话题范围太广了 不过收益颇深
我比较统一kejun的观点 无论自己写的js库，第三方的库，主要都是从那几方面入手
1.DOM标准 提供一些标准的DOM操作功能[event,选择器,等等……]
2.ajax支持，FX（一些效果）支持
3.通用的一些widgets
那么现在我们所缺乏的 也就是JS的组织 与管理 ;月影讲的百度有啊在写的js库 也是更多的像这方面靠拢
[YUI3 已经有一些依赖机制 等方便我们管理自己的JS]

第二个阶段：可能HTML5+CSS3离我们真的很近 但是离用户却有些远的原因吧 话题交集在浏览器上面了

目前IE系列浏览器没有对HTML5和CSS3的支持 而在目前的情况 IE的市场占有率确实>50%的
所以话题最终结论可想而知
1.针对自己所处的行业与用户群来适当的进行一些尝试
2.可以用渐进增强的方式 为高级浏览器用户 提供更好的体验
3.作为专业的前端工程师 我们必须去学习与研究新的技术

再上几句会议上经典的：
你该换家公司为中国互联网做贡献了！
前端工程师的价值不在于切页面,也不在于极快地切页面
你用IE6！你全家都用IE6！
用IE收手续费 用其他浏览器优惠！
前端不可以挣钱　但可以省钱！

一直听说Zen Coding 最近一直在研究前端最合适的IDE 所以也索性尝试了一下

ZenCoding项目地址：http://code.google.com/p/zen-coding/

先说环境 我是在MyEclipse > aptana 下面安装的Zen Coding

安装方法不难 建立一个项目 新建一个文件夹叫 script 然后把Zen Coding拷贝进去就可以了

Aptana/Eclipse

由于Aptana本身就是基于Eclipse的，所以，Zen Coding也是支持Eclipse的，只是需要一个EclipseMonkey插件的支持，Aptana已经封装了这个插件，所以如果你使用 Aptana，下面的第一步可以跳过。

1. 通过更新网站安装EclipseMonkey: http://download.eclipse.org/technology/dash/update(如 果你使用Aptana，可跳过这一步)
2. 在你的当前工作去创建一个顶级的项目，给它命名，比如，就叫zencoding
3. 在新创建的项目中创建scripts文件夹
4. 解压缩下载的ZIP插件包到该文件夹。项目结构看起来就像这样:
5. 安装之后，Aptana的菜单栏中的“脚本(Script)”菜单中将会出现Zen coding相关子菜单

注意事项：

• Aptana版的官方插件是基于MAC机的，如果你用的是Windows，需要手动更改快捷键(在每个文件头部的注释片段中更改)
• 官方的文件编码有点儿乱，修改官方js的时候，请注意编码问题，修改不当会造成相关功能的丢失

试用了一下发现确实很爽

具体的看下面介绍

阅读全文…

记得前几天看了D2的视频 kejun兄讲的库时代和框架时代 让我感同身受 因为我所做的项目用的是Jq库 不知不觉的一个个插件让页面的已经一大排了~
所带来的另一个问题 是库的升级问题 公司目前的项目貌似有用jquery1.2.6的 有用jquery1.3.2的 还没有完全的更新到新版
这不是Jquery1.4又出来了么 看了一下新版的API还是不错的 New or Changed in 1.4 部分 点击查看

vfresh兄弟已经写了一个新版的概述 我就直接转载过来了
阅读全文…

译序：本文译自Smashingmagazine，但是原文讲述的内容有些浅，也不是很完整，前端观察在翻译的前提下，增加了更多的更系统的内容。如有不足之处，欢迎指正补充。

随着网络的发展，浏览器具有更强的渲染更高级代码的能力，我们正逐步实现跨越所有平台和浏览器的目标。我们不但可以要花费更少的时间来确保我们的盒模型在IE6中看起来正常，而且形成了鼓励创新、避免hack、重前端脚本的氛围。

网络是一个非常好的环境，也是一个有丰富的知识来分享的协作社区。我们想要有圆角，我们就实现了它；我们想要多背景图片，我们实现了它；我们想要 边框图片，我们也让它实现了。所以需求从来不是问题，否则，我们可能还都仍然在使用table来布局页面而且使用过多的代码呢。我们都知道，网络无所不能。
阅读全文…

今天得到产品经理的一个需求
分类体系 一级分类 以及其子分类 在一个标题栏上展示 只显示5个子分类 其余显示为下拉列表 效果如下图

由于对前端比较痴迷 于是乎用前端来实现了一下 之前这样的需求 都是程序员去做判断 来实现的
查看DEMO
下载代码
已在如下浏览器测试 IE6 IE7 IE8 FF3.5.6 Opera10 Safari4
页面结构用前端实现如下

<div class="Area">
  <div id="menu1" class="main_tit">
	<h2><a href="http://www.iamued.com">IamUed.com-前端开发</a></h2>
	<ul  class="sublist">
		<li><a href="http://www.iamued.com">javascript</a></li>
		<li><a href="http://www.iamued.com">Ria</a></li>
		<li><a href="http://www.iamued.com">ActionScript</a></li>
		<li><a href="http://www.iamued.com">Flash</a></li>
		<li><a href="http://www.iamued.com">Flex</a></li>
		<li><a href="http://www.iamued.com">W3C</a></li>
		<li><a href="http://www.iamued.com">xhtml</a></li>
	</ul>
  </div>
  一级内具体内容
</div>

可以看到 对于程序输出来讲 这样的结构不需要任何逻辑 相对代码结构清晰整洁

核心JS代码如下
阅读全文…