Flex新手学习指南(转自RIACHINA)
常常看到有人问,初学者该怎么学习Flex,我该从哪里入手?我每次都很想耐心的回答这个问题,但还是因为想说的内容太多,反而觉得那时候说肯定会漏掉一些重要的东西和步骤,所以没说。趁现在休息的时间,给自己一点思考,希望写出的东西也能更全面一点。
此 玩意称之为Flex Component Library, 虽然说这版本还是Flex2.0Beta3的版本, 但是如果Flex3.0还没到来, 我认为这东西还是Flex的初学者们必看的, 它让我们能知道Flex给我们提供了什么样的模板(为什么称为模板, 我想这是因为其实这些控件我们都可以亲手把它给创造出来, Adobe只是提供了平常常用的稳定的控件, 我们不用每次都写而已, 但说实话, 就算是大公司写的东西, BUG实在很多, 也许就单独一个而言,它是满好的,但N多东西结合在一起的时候,我会常常叫OMG)。
Flex Component Library缺少了Chart这一类, 但是这东西我想你要用到它的时候你再去看也不迟, 我建议Flex Component Library中的Effects, States, Transitions, Printing可以滤过, 因为对于新人来说, 看完其它的东西已经足够了。 在看完Flex Component Library的内容之后, 我希望大家都能把源码放到自己机器上跑一跑, 自己写一写。 问到为什么的时候, 你只要记住内容就可以了, 不用再追问下去。
Adobe Flex 2 Component Explorer
名 字很象吧, 但内容就不一样了, 在学完以Macromedia为名义的Flex 2 Component Explorer之后, 我们再学学"新东家"Adobe的Flex 2 Component Explorer。 做法跟上面一样, 所做的我想就是保持好心态。
Demo
我希望各位的第一个Demo是一个 Application+TitleWindow, 功能很简单, 在Application上有个DataGrid, 把里面选中的值传给TitleWindow里的DataGrid, DataGrid有添加, 修改, 删除的操作。如果希望难度加打点？加上httpService怎么样？要么Remote？不用心急，这些都可以放下。
想自己的画面好看一点, 那就来看看Adobe给我们提供了的工具。 如果还觉得不满意呢, 我们的Flexer--Jason Hawryluk自己写了个Flex 2 Primitive Explorer, 去看看? 如果你要更好看, 那你就去学CSS或者scale9。
Create Applications
Create Application
我想完成到这一步肯定已经有了部分的基础，继续提高自己的话那你可以到Adobe Flex App Sample 下载sample进行学习，sample中比较推荐的是Flex Store，还有一个重要的sample那就是Flex Style Explorer v2.0.1的源代码和Flex 2 Primitive Explorer的源代码，只要右键，你就能看view source。
Project in Structure
一个好的工程没有一个好的架构那是做得非常吃力的。对于已经成熟的团队，我非常推荐大家使用Adobe 推荐的Iteration::two公司的Cairngorm和Jeremy的Riawave.
Create Components
Base
也 有很多人问，上面东西我都会了，想写一个控件该从何处入手，最简单和最实用的方法是Help(F1)----->Adobe Flex 2 Help----->Creating and Extending Flex 2 Components，其中有2个重要的章节那就是Creating MXML Components 和 Creating ActionScript Components，顾名思义那就是如何用mxml和ActionScript来创建控件，里面的东西一定要全部看完
Ready
做 完Base以后，我们将以实例子进行学习，打开X:\Program Files\Adobe\Flex Builder 2\Flex SDK 2\frameworks\source\mx\controls，里面有个Button.as，对，没错，这就是Button.as的源代码，而且还是 从UIComponent继承过来的最简单的控件之一，我们要做的是要读懂它的一文一字，就算是一个Boolean，里面也隐藏了很多学问。
Go
Ready之后，Go还成问题么？
Help
要Help吗？为什么每次遇到困难问题的时候总是去问身边的人。我不得不说的是当一个看Help(F1)的人和一个问别人的人在一个月内学习Flex，一个查看Help文档的人领先的不只是一条街那么大的距离。Any Question? Please Push F1!
Community Organizations
RIAChina --- 中国RIA开发者论坛，是全国数一的关于Flex的讨论社区，里面隐藏着众多的高手，而且很多已经参加了工作并在实际项目中。
RIADev --- 联系两岸三地的关于Flex/Apollo的华人论坛社区，它所表现的优势在于只要一提出问题，它将以邮件的方式以最快的速度发到每位成员手中，最重要的它是Jeremy带头的。
FlexCoders --- 全球最大的Flex用户讨论组织，只要是关于Flex的问题，你都可以在这里提出，而且常常回答者都是Adobe公司参加或者跟Flex相关的工作人员，当然前提条件是你要具备对英语的阅读能力和表达能力。
FlexComponents--- FlexCoders 的同胞兄弟，这里讨论的都是关于控件的问题，前提条件还是英文:-)
Books
Adobe Flex 2: Training from the Source
Adobe Flex 2.0.1 Help
Adobe Flex 2.0.1 Language Reference
Advanced ActionScript 3 with Design Patterns
ActionScript 3 Cookbook
Make things move
Programming Flash Communication Server
Apollo for Adobe Flex Developers Pocket Guide
AS3 Tip Of the Day !
End
当然Flex的路还是很长，并祝各位好运!
原文地址：http://www.riachina.com/showtopic-6085.html
创建性感CSS样式表的十个技巧
如果你想成为一位CSS专家的话，光背出一堆选择器是不够的，还要能够提高CSS样式表的可读性，开发效率以及维护性。这里，Jina Bolton 将给我们分享一下她关于如何创建性感的CSS样式表的十个技巧。
本文主要内容为：CSS代码编码规范，教你如何写出整洁漂亮性感的css代码，如何清晰的组织你的样式表文件。闲言少叙，直接进入正题，完整文字请查看原文。
十大 Ajax 框架(排名不分先后)
引语
毫无疑问，Ajax作为当前最火爆的技术之一，其优秀的框架层出不穷。Prototype、Dwr、Dojo、JQuery、YUi…… 都是非常出色的产品。本专题为您介绍了目前十大流行的Ajax框架及各自特性，供您在开发过程中参阅。
您当前正在使用的Ajax框架是什么？哪一个又是您心目中最优秀的呢？欢迎您发表评论，与他人分享您的观点。[发表评论]
十大Ajax框架(排名不分先后)
input高级用法
1.取消按钮按下时的虚线框
在input里添加属性值 hideFocus 或者 HideFocus=true
2.只读文本框内容
在input里添加属性值 readonly
3.防止退后清空的TEXT文档(可把style内容做做为类引用)
<INPUT style=behavior:url(#default#savehistory); type=text id=oPersistInput>
4.ENTER键可以让光标移到下一个输入框
<input onkeydown="if(event.keyCode==13)event.keyCode=9" >
5.只能为中文(有闪动)
<input onkeyup="value=value.replace(/[ -~]/g,’’)" onkeydown="if(event.keyCode==13)event.keyCode=9">
6.只能为数字(有闪动)
<input onkeyup="value=value.replace(/[^\d]/g,’’) "onbeforepaste="clipboardData.setData(’text’,clipboardData.getData(’text’).replace(/[^\d]/g,’’))">
7.只能为数字(无闪动)
<input style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9" onKeyPress="if ((event.keyCode<48 || event.keyCode>57)) event.returnValue=false">
8.只能输入英文和数字(有闪动)
<input onkeyup="value=value.replace(/[\W]/g,’’)" onbeforepaste="clipboardData.setData(’text’,clipboardData.getData(’text’).replace(/[^\d]/g,’’))">
9.屏蔽输入法
<input type="text" name="url" style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9">
10. 只能输入 数字，小数点，减号（-） 字符(无闪动)
<input onKeyPress="if (event.keyCode!=46 && event.keyCode!=45 && (event.keyCode<48 || event.keyCode>57)) event.returnValue=false">
11. 只能输入两位小数，三位小数(有闪动)
<input maxlength=9 onkeyup="if(value.match(/^\d{3}$/))value=value.replace(value,parseInt(value/10)) ;value=value.replace(/\.\d*\./g,’.’)" onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 && event.keyCode!=45 || value.match(/^\d{3}$/) || /\.\d{3}$/.test(value)) {event.returnValue=false}" id=text_kfxe name=text_kfxe>
------------------------------------------------------------------------
<input type="text" name="input1" value="中国">
怎样使input中的内容为只读，也就是说不让用户更改里面的内容。
<input type="text" name="input1" value="中国" onfocus=this.blur()>
<input type="text" name="input1" value="中国" readonly>
<input type="text" name="input1" value="中国" disabled>
最好不要用disabled,不然就无法取出里面的值了.
<input type="text" name="input1" value="中国" readonly="true">
<input type="text" name="input1" value="中国" readonly style="color:#999 ;">
21个css和Ajax表格
表格对于网页设计师来说再熟悉不过，随着web标准的兴起，表格不再承担架构网页布局的重任。回归到它本来的功能，表现数据。恐怕有很多网页设计师都没有兴趣，我们精选了当今互联网上正在应用的和已经设计好的21个css和Ajax表格，教你一些在表格里用分类和过滤的功能展示信息的有用的技巧。对您在设计网页时起到锦上添花的作用。
50种强大的CSS技术
这是来自SmashingMagazine的又一个CSS相关资源收集文章，事实上，里面有一半多的技巧，帕兰在之前翻译Noupe的101个CSS技术高级应用教程(上)和101个CSS技术高级应用教程(下)里面都已经介绍过了。 不过还是全部翻译一个，就当作是复习吧。
101个CSS技术高级应用教程
原文:101 CSS Techniques Of All Time- Part 1
翻译: 帕兰
CSS从根本上改变了网页设计，它让网页样式与网页基本元素分离，只需要通过一个小小的style.css文件里面，对相应元素定义众多的属性，就可以实现完全的整站改变。CSS是强大的，是伟大的，是不可或缺的。
要掌握CSS并不困难，帕兰随时自信满满的跟一些想学习CSS的朋友说:学会CSS所需要的时间，最短一天，最长一个星期。事实也确实如此。但要成为一个真正的CSS高手，那就不是一两天的事情了。你需要掌握一些比较高级的CSS应用技巧，甚至是去创建一些还未发掘出来的CSS应用技巧。
Noupe为我们收集了101个CSS技术的高级应用，这些CSS应用技巧里面，有的你甚至可能从来都没有听过，但如果你是一个网页设计爱好者，你应该去了解它。它们代表着当前最流行最实用的CSS应用，如果你能把它们都掌握并加以运用，你完全可以晋升为一个标准的CSS高手。
mootools 教程
mootools【一】- 起步篇
以前一直在用prototype.js，最近发现了mootools,据说也相当不错，它是个纯OO的javascript 框架，所以拿来学习学习，把学习经过记录下来。
mooltools学习资源
http://clientside.cnet.com/wiki/mootorial/ --- The Mootorial：比较完整的mootools教程
http://solutoire.com/2007/02/16/mootools-ajax-xhr-classes/ --- ajax 和 XHR
http://solutoire.com/2007/01/31/mootools-10-whats-new/ --- Mootools 1.0: What’s new
"http://solutoire.com/2006/12/25/porting-prototype-enumerable-functions-to-mootools-array-objects/ --- 将 Prototype的Enumerable移植到Mootools Array
http://www.coryhudson.com/blog/2006/09/12/extending-objects-and-classes-with-mootools/ --- 用mootools扩展 Objects 和 Classes
http://www.coryhudson.com/blog/2006/09/14/useful-utility-functions-in-mootools/ --- Mootools中有用的“Utility”函数
http://www.coryhudson.com/blog/2006/09/26/extending-dom-nodes-with-mootools/ --- 用 Mootools 扩展 DOM Nodes
http://www.snook.ca/archives/javascript/mootools_drag_a/ --- Mootools 拖拽实例
http://smoothgallery.jondesign.net/getting-started --- 在你的网站上创建一个画廊或幻灯
http://www.chromasynthetic.com/blog/wp-content/uploads/2006/09/mootools1.html --- 简单的导航条实例
http://www.chrisesler.com/mootools/mootools-dragwindow.html --- 可拖动的窗口实例（实际上是可拖动的div）
http://www.chrisesler.com/mootools/mootools-rowcolumnhighlight.php --- 表格行列高亮实例
http://techblog.billkrueger.com/2006/10/11/mootools-sortable-list-example/ --- 可排序列表实例
http://www.digitalknk.com/2006/10/10/final-class-project-complete/ --- 可折叠菜单的视频教程
http://solutoire.com/2007/01/16/mootools-playing-with-height-transitions/ --- 非常好的tab菜单教程（Mootools: playing with height-transitions）
http://solutoire.com/2006/11/29/mootools-the-ajax-class/ --- 关于ajax类
http://www.thepcspy.com/articles/programming/ajax_search_with_ms_live_and_mootools --- 用Mootools实现基于ajax的Ms live查询
http://solutoire.com/2006/11/29/mootools-horizontal-accordions-explained/ --- 又一个可折叠菜单
http://solutoire.com/2006/12/18/mootools-json-explained/ --- Json模块与php教程
http://dev.digitarald.de/tile.html --- 移动背景实例
http://www.dotes.com.br/mootools/FlyOverBackground.html --- 移动背景实例（fixed for ie）
http://dev.digitarald.de/ghostdrag.html --- 拖拽实例
http://dev.digitarald.de/tabs.html --- tab实例
http://beautyindesign.com/tutorial/free_series_mootools_for_the_rest_of_us.php --- 5节课的Mootools教程：MooTools for the Rest of Us
http://www.chrisesler.com/mootools/fisheye/index.php --- Mac os dock样式的菜单
二. 插件
http://smoothgallery.jondesign.net --- JonDesign的SmoothGallery：画廊、幻灯和展厅
http://www.electricprism.com/aeron/slideshow/ --- 幻灯
http://smoothslideshow.jondesign.net --- JonDesign的幻灯类库
http://solutoire.com/2006/11/29/fxfont-mootools-and-font-resizing/ --- Fx.Font 自动改变文字大小
http://www.brunofigueiredo.com/archive/2006/09/14/88.aspx --- moobox：实现简单的LightBox效果
http://www.brunofigueiredo.com/archive/2006/09/21/103.aspx --- 反射效果
http://www.brunofigueiredo.com/archive/2006/09/15/93.aspx --- 另类图片标签
http://www.brunofigueiredo.com/code/jsShadowReflection/extension_1.htm --- efxFactory 0.1 BETA:阴影和反射效果库
http://inviz.ru/moo/transcorners/ --- 圆角效果
http://www.digitalia.be/software/slimbox --- Slimbox：完整的Lightbox克隆，只有7k
http://www.digitalia.be/software/reflectionjs-for-mootools --- 反射 Reflection.js
http://nhatanh.voxfamilyvn.com/moo/slider.html --- Moo.Slider：滑动器
http://nhatanh.voxfamilyvn.com/moo/calendar.html --- Moo.Calendar：日历
http://og5.net/~wusch/?cat=javascript --- ie6的png透明插件
http://www.clanccc.co.uk/moo/sortlist.html --- 嵌入式可排序列表
http://www.blackmac.de/archives/44-Mootools-AJAX-timeout.html --- AjaxPlus：为AJAX增加超时事件
注意：部分.de域名需要用代理上，推荐的代理工具：vidalia
下载：http://vidalia-project.net/download.php
6个出色的 Adobe AIR 程序
Adobe AIR 平台允许开发者创建运行于桌面的 Web 程序而不再需要浏览器的支持。现在 AIR 已经摘下 Beta 标签，让我们看看有哪些有趣的 AIR 程序正在应用。如果你想知道，为什么我们面对 AIR 如此兴奋，可以读一读这篇文章：Our analysis about the platform。我们在这里列举6个值得一看的 AIR 程序来感受一下 AIR 的魅力。
