Yahoo之前提供了公开的YUI Hosting，现在又在这个基础上进一步提供了combo handler服务。这项服务的目的是尽可能减少http请求的数目，以提高web前端的展现速度，这也是高性能网页开发的14条军规之首。
此前，如果要使用YUI Rich Text Editor，需要引用若干外部js。共计6个http请求。
如果使用combo handler，那么http请求数可以合并成一个，如下：
可惜这个host在国外，对国内的yui用户来说，没有什么帮助。
基于yui grids的wordpress主题 — YUI Autogrid Minima
我也试用YUI Uploader
早就知道YUI里面有Uploader这么一个上传组件，可以按住ctrl多选文件上传(就像flickr那样的上传)，并且可以支持进度条，这样对用户来说是相当方便的。
由于YUI Uploader是利用javascript + flash实现的，所以用户的浏览器上只要有flash player就可以使用，也不需要额外安装别的插件了，这显然也是YUI Uploader的一大优势。
我的YUI Uploader试用之旅
- 首先下载Uploader批量上传页的html源文件
- 解压后放置在你的web服务器上，比如我就是在自己的台式机上安装了一个xampp
- 现在需要一个处理上传操作的后端程序，在这里我是用php简单的写了一个，如果你用别的语言也是不成问题的。在uploader-advanced-source.html的同一目录下放置upload.php，源文件如下：
foreach ($_FILES as $fieldName => $file) { $name = md5(microtime()); move_uploaded_file($file['tmp_name'], "./" . $name . '.jpg'); echo $fieldName . ' uploaded!'; } - 下载http://yui.yahooapis.com/2.5.1/build/uploader/assets/uploader.swf，然后把uploader.swf放在和upload.php的同一目录下，这是为了避免javascript和flash交互过程中出现跨域问题。
- 修改uploader-advanced-source.html
- 把”YOUR UPLOAD URL GOES HERE”替换成你的upload.php所在的url，比如我的就是http://localhost/yui/upload.php
- 把YAHOO.widget.Uploader.SWFURL修改成你的uploader.swf实际url
- 现在访问uploader-advanced-source.html，试试批量上传功能吧
试用的一点补充
- 这个例子里面的php源文件只是考虑上传n张jpg文件的情况，可根据实际情况调整。
- 上传后的文件名是md5随机加密的，在upload.php同一目录可见
- 由于flash的bug，运行在windows下的firefox无法正确获得flash传递过来的cookie，如果上传应用对cookie有依赖，可能会需要做额外的处理。
为了能够确切的显示上传进度条，可能需要php 5.2的apc扩展支持- 上传进度由flash完成
- YUI 2.5.2已经附上uploader.swf的actionscript，有一定的学习价值
贴一张Uploader使用效果图
JQUERY和YUI混用出现的问题
YUI 2.5.0发布
YUI 2.5.0发布。
2月20日，YUI Team发布了YUI的最新版本2.5.0。增加了6个全新的组件：Layout Manager, Uploader(结合Flash和Javascript的多文件上传引擎), Resize Utility, ImageCropper, Cookie Utility和ProfilerViewer Control。同时这一版还提升了DataTable Control的功能和Slider Control增加了双滑块功能。
这个版本中的Uploader以及ImageCropper应该是相当有用的控件
- Uploader采用javascript和flash，不仅支持多文件上传，更可以直观的查看上传进度，以前虽然有类似的代码，但是组件化的代码显然通用性和可用性更好。
- ImageCroper可用于制作图片切片，基于YUI的Dragdrop和Resize
与YUI 2.5.0相关的链接
YUI中国本地版
YUI 2.3.0的Rich Text Editor
YUI 2.3.0正式发布了。这个版本新增了一些新的组件，其中最大的亮点是它的Rich Text Editor (beta)，样式见下图：
- 标识为A级的浏览器支持良好，跨浏览器也有很好的表现
- 扩充方便，可以添加你自己的button
- 从图片上看，这个编辑器还支持直接从flickr抓取图片——可惜flickr在国内已经被和谐…
YUI Rich Text Editor的特点
- Base CSS
- YUILoader Utility (beta)
- ImageLoader Utility (experimental)
- Color Picker Control (beta)
- YUI Test Utility (beta)
YUI 2.3.0另外新增的5个组件
Ajax+PHP+YUI手工制作rss阅读器
YUI 2.3.0 即将发布
YUI 2.3.0 即将发布,最迟七月份可以看到。新的YUI组件和特点:
1. Rich Text Editor
The YUI RTE beta comprises an editor window and toolbar, the latter of which has a simple, extensible plugin architecture. It will feature full A-grade support. (Dav Glass)2. ImageLoader Utility
Images often constitute the most data-heavy parts of a page, but many times users load images that they never see — because the image is below the fold, because it is in an obscured tab in a TabView, etc. The YUI ImageLoader is a new, experimental component that allows you to defer the loading of images based on criteria you specify and to then load those images when a specific “trigger” is hit. In some cases, use of ImageLoader can significantly reduce bandwidth and increase performance. (Matt Mlinac)3. Base CSS
YUI’s Reset CSS normalizes browser CSS styles by stripping out browser-defined styles; this allows you to begin your CSS styles with all style decisions being intentional rather than inherited. YUI’s Base CSS will help you begin the process of making your styles intentional by providing a common set of treatments that most implementations share. (Nate Koechley)4. Color Picker
Previous versions of YUI shipped a Color Picker example as part of the Slider Control. In 2.3, we’re formalizing Color Picker and completing its API to make it easier to implement this powerful control in your apps. (Adam Moore)
Notable Changes to Existing Components:
1. Button
Button remains in beta as we modify the architecture a bit. As of 2.3, the SplitButton implementation will replace MenuButton and be generic — allowing you to implement Buttons that have Menus or any other sub-control you wish. (Todd Kloots)2. Connection Manager
YUI’s XHR utility will be enhanced with a Custom Event API that adds granularity to the interesting moments you can pipe into on your XHR transactions. (Thomas Sha)3. DataTable
DataTable will undergo a major rearchitecture as it evolves to its second beta. Details on the DataTable evolution for 2.3 will be presented during an open conference call for all interested implementers during the second half of June. An invitation to the call will be sent out to this list a week prior to that call. (Jenny Han)4. Browser History Manager
Browser History Manager comes out of experimental status with 2.3 and is promoted to beta, accompanied by several bug fixes and some key enhancements requested by YUI implementers during the experimental phase. (Julien Lecomte)
Yahoo提供公开的YUI Hosting
最近YUI出了2.20版,紧接着就在其主机上免费提供YUI里用到的css,javascript以及图片.
免费提供的资源
- JavaScript files: These files provide the functional behavior of YUI utilities and UI controls.
- CSS files: In some cases, YUI controls ship with predefined visual designs, enabling you to implement them more easily out of the box. In these cases, presentation information is included in CSS files accompanying the control.
- Image files: Where YUI controls have default visual designs, those designs may be supported by image assets.
试了一下,可惜在国内的访问过去速度比较慢,要不然自己的服务器上就可以直接引用YUI了.详情见这里
什么是YUI?
Yahoo! User Interface Library
The Yahoo! User Interface (YUI) Library is a set of utilities and controls, written in JavaScript, for building richly interactive web applications using techniques such as DOM scripting, DHTML and AJAX. The YUI Library also includes several core CSS resources. All components in the YUI Library have been released as open source under a BSD license and are free for all uses.