No doubt every web designer has spent many endless hours mocking up web pages, and as such every designer should have a good set of re-usable and uniform Web UI elements that they can rely upon to save them precious time and spare headaches when they are in the initial stages of a web project.

In this article we have 20 completely free Web UI kits and stencils that are perfect for the initial mockup or wireframe stage of a web design project. Most of the kits are editable and the kits are in either .psd, .ai or .png format, but you will also find some Omnigraffle stencils and some kits in .svg format. So, whatever your preferred format you are bound to find the perfect kit for you.

Modern Web UI Set (.psd)

This free Web UI Set has everything included in the PSD file in well organized in folders, and fully editable using vector layers in Photoshop, from the button shapes, to the gradients, and text. Having every element editable means you can recreate anything you need that is not included in the file, just by using existing items as your base.
Modern Web UI Set (.psd) →

Massive Web UI & Button Set (.psd)

This free UI set contains all of the following elements in three distinct styles: glossy, satin/light gradient, and one-color. The satin/light gradient set is available in 7 different colors (which you’ll find all of in the psd file).
Massive Web UI & Button Set (.psd) →

Web UI Element Pack (.psd)

This User Interface Element Pack in PSD format, contains 19 elements including Loading Bar, Button in normal and clicked state, Button toggle, close, next, previous and paging icon and slider.
Web UI Element Pack (.psd) →

Web UI Wireframe Kit (.psd)

This web UI template kit is made completley with shape objects and in some cases converted into SmartObjects. So they’re totally scalable.
Web UI Wireframe Kit (.psd) →

Browser Form Elements (.psd)

Browser Form Elements (.psd) →

Web Page Elements (for Omnigraffle)

With the open-source “Bitstream Vera” font set, free icons from FamFamFam and this Omnigraffle web ui set, you should have most of your common web page elements covered, including headings, form elements, content management function, image placeholders, etc.
Web Page Elements (for Omnigraffle) →

Wireframe Kit (Google Drawings)

Google Drawings is still in its early and simple form and didn’t have any notable UI kits, until now. These kits have been specifically designed for Google Drawings, and you have a choice of four templates, that include: The main blank template, product detail page, landing page and item list view.
Wireframe Kit (Google Drawings) →

Sketching & Wireframing Kit (.ai, .eps, .pdf & .svg)

Sketching & Wireframing kit is a free set of elements for sketching and wireframing. It consist of form elements, icons, indicators, feedback messages, tooltips, navigation elements, image placeholders, embedded videos, sliders and common ad banners.
The Kit comes in two vector formats, one for Adobe Illustrator and the other in SVG vector format that can be easily modified. It can also be downloaded in PDF and EPS formats.
Sketching & Wireframing Kit →

Wireframe Symbols (.ai)

This download contains the symbol library and a full Adobe Illustrator file with all of the elements spread out on the art board. To install this library just drag and drop the file named “Wireframe Symbols.ai” into your Adobe Illustrator Symbols directory. Once you are in Illustrator go to your Symbols Palette and load the library.
Wireframe Symbols (.ai) →

Yahoo Design Stencils (.xml, .pdf, .svg, .png and Omnigraffle)

The popular Yahoo! Design Stencil Kit version 1.0 is available for OmniGraffle, Visio (XML), Adobe Illustrator (PDF and SVG), and Adobe Photoshop (PNG), and covers the following topics: Ad Units, Calendars, Carousels, Charts and Tables, UI Controls, Form Elements, Grids, Menus and Buttons, Mobile, Navigation and Pagination, OS Elements, Placeholder Text, Screen Resolutions, Tabs and Windows and Containers.
Yahoo Design Stencils (.xml, .pdf, .svg, .png and Omnigraffle) →

Ext JS v3.0 Stencil (for Omnigraffle)

This is the updated version of the Omnigraffle ExtJS stencil Ext JS. This update contains many improvements and additions, namely that the developers have recreated most Ext JS elements as Graffletopia shapes or groups. This is especially helpful for resizing titles, tables cells, and so on.
Ext JS v3.0 Stencil (for Omnigraffle) →

165 Vector Icons in 5 Colours (.ai, .jpg and .svg)

This huge kit, from Liquidicity, contains 165 icons and are available in these five colors: Red, green, blue, black and white.
165 Vector Icons in 5 Colours (.ai, .jpg and .svg) →

Flex 3 Stencil (for Omnigraffle)

This Omnigraffle stencil contains all of the Flex components from the Flex 3 Style Guide: panels, data grid, buttons, fields, links, toggle, menu, scrolls, accordion, tabs, list, data picker, tool tip, errors.
Flex 3 Stencil (for Omnigraffle) →

Twitter Widget Stencil (for Omnigraffle)

This stencil includes a selection of useful Twitter badges and widgets.
Twitter Widget Stencil (for Omnigraffle) →

Web Designer Toolkit (.psd)

Web Designer Toolkit (.psd) →

Facebook GUI (.psd)

Facebook GUI (.psd) →

Facebook Applications (Omnigraffle)

This is a pretty sizable collection of Facebook related elements to use in creating wireframes for Facebook applications.Facebook Applications (Omnigraffle) →

Web Elements Kit (.psd)

This huge set of various web elements with 17 easy to modify modules, with each module comes with four different color options.Web Elements Kit (.psd) →

Flex Darkskin UI (.psd)

This beautiful and polished free Flex UI skin is available for free from psdthemes.com, but you do need to signup first.
Flex Darkskin UI (.psd) →

WEB UI Treasure Chest

WEB UI Treasure Chest →

Something we hear over an over in the design world is that less is more. Even though using that statement has become a bit cliche, it is true – especially when it comes to logo design. Sometimes designers can get carried away with trying to incorporate too many complicated elements into a logo. It’s better to keep things simple and make use of clever negative space and typography. These types of marks are usually far more effective and memorable. To inspire you, here are 20 Examples of Simplistic but Effective Logo Design.

CSS3 continues to gain popularity as we’re seeing it used in more and more websites. However, there are still those out there that are holding out on learning it and using it. This is probably due to the fact that it’s not fully supported yet in all browsers. Nevertheless, if you’re one of those that haven’t started using CSS3 or you’re a CSS3 pro just looking to speed up your work flow, here are six CSS3 tools that you should find useful.

CSS3 Button Maker

The CSS3 Button Maker gives you a number of sliders and color pickers to style your own CSS3 button. Then you can grab the code to use in your own project.

CSS3 Generator

Select from a list of CSS3 properties, fill in a few parameters to fit your needs, and it spits out the generated code along with a live preview.

CSS3 Please!

CSS3 Please! is a CSS3 rule generator that acts as a sort of playground. It allows you make various CSS3 tweaks and see a live preview. Then you can copy and paste into your own file.

CSS3 Gradient Generator

The CSS3 Gradient Generator was created as a showcase of the power of CSS based gradients as well as a tool for developers and designers to generate a gradient in CSS.

CSS3 Transforms

CSS3 Transforms gives you a set of sliders to experiment with various transforms such as position, rotation, skew and more. It also generates the corresponding code on the fly.

CSS3 Selectors Test

CSS3 Selectors Test automatically runs a large number of small tests which determines if your browser is compatible with a large number of CSS selectors. If it is not compatible with a particular selector it is marked as such. You can click on each CSS selector to see the results, including a small example and explanation for each of tests.

As designers, we often recycle the same fundamental elements when wireframing or mocking up a design. However, by utilizing a library of reusable web UI elements, we can make the design process on each project more efficient, and cut down on research and design time.

This post covers 10 of the best free web UI kits, resources and stencils from around the web to kick-start the early stages of your next project.

If you’re partial to any particular free web UI kits or resources, let us know about them in the comments below.

1. UI Design Framework

This is a complete design framework that includes a Graphical User Interface (GUI) library with hundreds of vector elements for interface design. Plus, it has a minimal UI icons set with 260 vector icons for Illustrator, and a library with 200 styles to apply in Illustrator. They can be utilized to create more comprehensive wireframes, mockups and deliverables using consistent, well-designed common UI elements.

Each vector element can easily be customized to suit your needs by resizing, coloring and tweaking its appearance, all neatly contained within organized Illustrator panels.

2. Web UI & Button Set

A large, versatile web UI and button set that should have something useful for everyone. It’s available in three different styles with over seven colors and contains elements with three distinct aesthetics: Glossy, satin/light gradient, and one-color. The satin/light gradient set is available in seven different colors (all of which you’ll find in the PSD file).

The individual elements in the set include control buttons, info and text boxes, navigation elements, drop-down and collapsible box styles, speech bubbles, search forms and loading elements.

3. Sketching & Wireframing Kit

This is a comprehensive and well-organized set of resources for sketching and wireframing that consists of form elements, icons, indicators, feedback messages, tooltips, navigation elements, image placeholders, embedded videos, sliders and common ad banners.

The kit comes in two vector formats, one for Adobe Illustrator and the other in SVG vector format, which can be easily modified. It can also be downloaded in PDF and EPS formats.

4. Browser & Form Elements

Designers Toolbox is an excellent resource; take note of the free web browser windows and standard HTML form elements. You can choose from several options, including Windows Vista (IE/Firefox), Windows XP (IE/Firefox) and Mac OS X (Firefox/Safari). Once you’ve chosen your operating system and browser, you can then download the required browser window size, ranging from 640×480px to 1600×1200px.

Each form element package includes pull-down menus, input fields, radio buttons, check boxes, buttons, text fields and scroll bars, all within an easily editable PSD file.

5. Modern Web UI Set

This is a clean and modern web UI set for use in web design, applications, and print. Its clean, black-and-white aesthetic means it can be used in virtually any situation. Included within the package are navigation elements, buttons, drop-down menus, scroll bars, and login panels. The set was built in a non-destructive way, meaning everything included in the PSD file is well organized in folders, and fully editable using vector layers in Photoshop, from the button shapes, to the gradients, and text.

Having every element editable means you can recreate anything you need that is not included in the file, just by using existing items as your base.

6. UI Design Kit

For those who don’t wish to create interactive or complex wireframes or mockups, this UI kit provides a worthy alternative. You can simply open it within Photoshop and start utilizing the elements included. The kit contains buttons, drop-down menus, scroll bars, navigation elements, speech bubbles, radio buttons, avatars, tabs, checkboxes, text fields, and a search bar.

Included within the package are shape objects, which in some cases have been converted into SmartObjects, so they’re completely scalable.

7. UI Buttons & Icons

Here, you’ll find a selection of 165 high-quality UI icons and buttons, available in AI, JPEG and SVG formats, meaning each element can be easily modified. There are also five different color schemes to choose from. The package contains icons, loading bars, symbols, buttons, arrows, and star ratings.

It’s a well-designed, clean collection that provides a good base to use when beginning any type of UI design, wireframe or mockup.

8. UI Library

This is a simple but extremely useful Adobe Illustrator symbol library file with all of the elements organized on the art board. The package contains scroll bars, lists, buttons, tables, tabs, ads, text fields, and loading bars. This library of UI components could be utilized well when creating wireframes or mockups.

To install this library, just drag and drop the file named “Wireframe Symbols.ai” into your Adobe Illustrator Symbols directory. Once you are in Illustrator, go to your Symbols Palette and load the library.

9. Web Elements Kit

Here, you’ll find a huge set of UI elements that are easily modified through the layer styles. There are 17 modules in total in the package, with each module containing various color options. You can either use the “all in one” PSD or the individual PSD files for each element. Overall, the set is well organized with each layer labeled, so you can simply drag and drop them into your project.

Each text field is fully editable, with easily customizable colors. Also included is a “How To” help file with information on how best to use the files.

10. OmniGraffle UI Stencils

Try out this set of shapes for creating wireframes and mockups in OmniGraffle. It consists of the basic components you’ll need to create user interface specifications. Included in the package are header and footer variables, buttons, switches, controls, sliders, menus, headings, arrows, tabs, media players, modal windows, a color picker, and pagination elements.

An OmniGraffle UX template is also available (free), which includes shared layers for basic UX document needs, including title page, wireframes, and storyboards. The UX Form stencil is also an excellent resource for OmniGraffle, which provides different button layouts, a progress indicator, captcha code input field, labels, and more.

Are there any other free UI resources you would recommend? If so, let us know in the comments below.

Web2.0很重要的一个特征就是交互性的强化，而拖放的引入，可以起到很好的交互效果，JQuery UI包已经包含了拖放，但拖放的应用不只应用于层的拖拉，接下来明河推荐几个独到的应用拖放的JQuery插件。

明河是推荐直接使用jquery UI包中的拖放，当你的需求jquery 拖放UI无法满足时，不妨看下以下插件。

1、Superfun

• 查看示例
• 点此下载

示例中演示了对倾斜容器的拖放，当然这个demo不兼容IE。

2、CropZoom

• 查看示例
• 点此下载

拖放在图片剪切中的应用，这个朋友么应该不陌生，这个jquery插件的强大之处在于，你不只可以改变剪切区域，还可以控制图片大小，以及图片的旋 转。

3、Jquery Iviewer

• 查看示例
• 点此下载

这款jquery插件可当做web地图的基础模型，对web地图有兴趣的朋友很有参考意义。

4、Dragscrollable

• 查看示例
• 点此下载

当你在容器内进行拖拉时滚动条也会随之滚动，明河觉得有意思的地方在于标尺。

5、Table Drag and Drop JQuery plugin

• 查看示例
• 点此下载

表格行数据拖放。

6、 jquery mb.containerPlus

• 查看示例
• 点此下载

华丽的弹出窗体拖拉，你可以自由的控制弹出的窗体。

7、Creating a Draggable Sitemap with JQuery

• 查看示例

可拖放的站点地图……貌似实际意义不大。

8、jQuery Reel Plugin

• 查看示例
• 点此下载

这个插件很有意思，产生类似全景的效果。

感谢锐商企业CMS的投递
新闻来源:speckboy.com
几乎所有的富 Web 应用都基于一个或多个 Web UI 库或框架，这些 UI 库与框架极大地简化了开发进程，并带来一致，可靠，以及高度交互性的用户界面。本文介绍了 15 个非常强大的 JavaScript Web UI 库，非常适合各种各种规模的富 Web 应用的开发。

LivePipe
LivePipe UI 基于 Prototype Javascript 框架，包含了一整套经严格测试并高度可扩展的 UI 控件，拥有很好的文档，在不支持 JavaScript 的环境中，可以无缝降级使用。包括 Tab, 窗体，文本框，多选框，评分控件，进度条，滚动条，右键菜单等多种控件。

LivePipe 首页与下载
LivePipe 演示与示例

UKI

UKI 是一套简单的 JavaScript UI 工具集，用于快速创建桌面风格的 Web 应用。包含的控件从滑动条，到分栏视图，不一而足。熟悉 jQuery 的开发者会发现这个工具很容易上手，非常简洁，无需安装框架，不依赖 CSS 引用。

UKI 主页与下载
UKI 控件，演示，示例

MochaUI

MochaUI 是 MooTools Javascript 框架 与 ExplorerCanvas 的一个备受欢迎的扩展，可以用来快速创建 Web 应用，Web 桌面，网站，饰件，独立 Windows，Modal 对话框等等。

MochaUI 主页与下载
MochaUI 控件，演示，示例

中文编译来源：锐商企业CMS 网站内容管理系统 官方网站
Sigma Ajax UI Builder
SigmaVisual 是一套基于 Web 的，所见即所得的 AJAX UI 创建工具，包含超过40个不见，如 Tab，对话框，树形图，时间线等，基于 JavaScript 和 PHP。

Sigma Ajax UI Builder 主页和下载
Sigma Ajax UI Builder 控件，演示和示例

JxLib based MooTools

JxLib 是一个基于 MooTools 的 JavaScript UI 框架，包含多数 Web 程序都需要的基本空间，如按钮，Tab，菜单，树形结构，对话框等等。JxLib 还支持换肤功能。

JxLib 主页与下载
JxLib 控件，演示与示例

Dijit – The Dojo Toolkit

Dijit 基于 Dojo，也是学习 Dojo 扩展的一个好起点。可以用来创建非常漂亮的 Web 2.0 GUI。支持多语种，甚至支持不同语种的文字书写方向以及本地化数字，日期等等。

Dijit 主页，下载
Dijit 控件，演示，示例

jQuery TOOLS

jQuery Tools 是一个非常轻量（2.5kb）的常用 UI 库，支持以下 jQuery 对象，Tabs, 工具提示，滚动条，层，表单以及 Flash 嵌套。

jQuery TOOLS 主页与下载
jQuery TOOLS 控件，演示，示例

jQuery UI

jQuery UI 基于 jQuery，包含 3 个大类，饰件，一些内置的 UI 对象；效果，对各种网页对象施加动画效果（如爆炸效果）；鼠标交互，如拖放操作。

jQuery UI 首页与下载
jQuery UI 控件，演示与示例

Prototype UI

Prototype UI 基于 Prototype 与 Script.aculo.us，包括多个模块（旋转木马，Modal 窗口，阴影，右键菜单等），每个模块可以单独安装使用。

Prototype UI 主页与下载
Prototype UI 控件，演示与示例

Jitsu

Jitsu 功能包括 XML 标记，页面编译，动画引擎，Ajax 以及运行时检测等等，它的 Ajax 功能使消费级 Web 应用的创建变得非常简单，支持客户端数据绑定，还可以将页面编译成 JavaScript，Jitsu 在 Firefox 和 IE 中运行最佳。

Jitsu 主页与下载
Jitsu 控件，演示与示例

Qutensil
Qutensil 仍在开发中，但其路线图已经显示出某些引人注目的东西，基于 Prototype 与 Scriptaculous ，包含消息，调色板，滑动条，工具提示，可拖放窗口以及警告，确认，提示等窗口。

Qutensil 主页，下载
Qutensil 控件，演示，示例

Script.aculo.us
script.aculo.us 是一个备受欢迎的 UI 工具集，基于 Prototype 框架，提供了诸如视觉效果，UI 控件以及面向 DOM 的工具。

Script.aculo.us 首页与下载

Alloy UI
AlloyUI 是一套功能丰富的 UI 框架，基于 YUI 3，部分基于 YUI 2，包含一套丰富的（超过60）UI 部件，如图片库，对话框，树形结构，面板，自动完成，按钮，日历控件，工具条等。

Alloy UI 首页和下载
Alloy UI 控件，演示与示例

iUI: iPhone UI 框架

IUI 包含一套 JavaScript 库，CSS 式样表及图片，是一个轻量级 iPhone UI 库，包含 iPhone 风格导航菜单，设备方向，iPhone 风格切换等功能，可以为你的 Web 程序带来 iPhone 般的体验。

iUI 主页与下载
XUI

XUI 是一个用于移动 Web 应用的轻量，极简，高度模块化的框架。它之所以非常轻量的原因是，它只支持移动浏览器，所有跨浏览器支持的代码都被剥离。它面向一线移动 Web 浏览器，如 Webkit，Fennec 以及 Opera，并有意将来对移动 IE 和黑莓提供支持。

XUI 首页，下载
Yahoo! YUI Library

Yahoo! YUI Library 可谓所有 Web UI 之父，可靠，功能丰富，目前已经发展到第 3 版。它拥有一个很庞大的开发团队，推出了非常丰富的功能，就功能而言，无可匹敌。

YUI Library 主页与下载
YUI2 入门
YUI3 入门
YUI3 控件，演示与示例

本文国际来源：Specky Boy 15 Javascript Web UI Libraries, Frameworks and Toolkits
中文编译来源：锐商企业CMS 网站内容管理系统 官方网站

Last week I posted a CSS3 dropdown menu and someone complained that I didn’t explain the CSS code in detail. Well, here is a post on the basics of the new properties: text-shadow, box-shadow, and border-radius. These CSS3 properties are commonly used to enhance layout and good to know.

RGBA

The first three values are RGB color values and the last value is the level of the transparency (0 = transparent and 1 = opaque).

RBGA can be applied to any properties associated with color such as font color, border color, background color, shadow color, etc.

Text Shadow

Text shadow is structured in the following order: x-offset, y-offset, blur, and color;

Set a negative value for x-offset to shift the shadow to the left. Set a negative value for y-offset to shift the shadow to the top. Don’t forget you can use RGBA values for the shadow color.

You can also specify a list of text-shadow (separated by a comma). The following example uses two text-shadow declarations to make a letter press effect (1px top and 1px bottom).

text-shadow: 0 1px 0 #fff, 0 -1px 0 #000;

Border Radius

The shorthand for border radius is similar to the padding and margin property (eg.border-radius: 20px). In order for the browsers to render the border radius, add “-webkit-” in font of the property name for webkit browsers and “-moz-” for Firefox.

You can specify each corner with a different value. Note Firefox and Webkit has different property names for the corners.

Box Shadow

The structure for box shadow is same as the text-shadow property: x-offset, y-offset, blur, and color.

Again, you can apply more than one box shadow. The following example is a list of three box shadow declarations.

-moz-box-shadow:
-2px -2px 0 #fff,
2px 2px 0 #bb9595,
2px 4px 15px rgba(0, 0, 0, .3);

//从文章中搜索图片并获取图片
$SoImages  = '~<img [^\>]*\ />~';
preg_match_all($SoImages,$post->post_content,$Images);
$PictureAmount=count($Images[0]);　//获取图片数量

//处理所有的图片
for($i=0;$i<$PictureAmount;$i++){
	echo $Images[0][$i]  //处理图片,语句可以自定义,第一张图片为$Images[0][0];
	}

//通过使用switch控制语句处理第一张图片,也可以使用if...else...elseif语句来实现,具体逻辑请自定义
switch($PictureAmount>0){
	case 1:
	  echo $Images[0][0];　//输出第一张图片
	  break;
	default:
	  $ImagesUrl=bloginfo('stylesheet_directory')."/images/1.jpg";　//当文章无图片时默认输出的图片
	}

/*获得文章中的图片链接路径的代码
*首先使用上面第一段的语句从文章搜索并获取图片
*然后通过运行正则表达式来分析图片代码,然后得到匹配的字符
*以下只列出其中的一种正则表达式代码,有兴趣的童鞋可以自己编写
*/

//获取一张图片,例如获取第一张图片$Images[0][0],其代码样例为:<img alt="Google" title="Google" id="logo" src="/intl/zh-CN/images/logo_cn.gif" width="276" height="110" border="0"  />
$ImgUrl = $Images[0][0];
$SoImgAddress="/\<img.*?src\=\"(.*?)\"[^>]*>/i";  //正则表达式语句
preg_match($SoImgAddress,$ImgUrl,$imagesurl);　　//分析
echo $imagesurl[1];　//得到并处理路径:/intl/zh-CN/images/logo_cn.gif?>

1 打开文件

　　resource fopen ( string filename, string mode [, bool use_include_path [, resource zcontext]] )

　　$handle = fopen(filename,mode)//打开文件，返回代表此文件的资源的句柄

　　文件名称可以使用相对路径或者绝对路径也可以使用网络协议模式，打开模式具有r\r+\w\w+\a\a+\x\x+\b

　　在操作二进制文件时如果没有指定 ‘b’ 标记，可能会碰到一些奇怪的问题，包括坏掉的图片文件以及关于 \r\n 字符的奇怪问题。

　　为移植性考虑，强烈建议在用 fopen() 打开文件时总是使用 ‘b’ 标记。

　　以下是几种打开文件的方式

　　$fp = @fopen(‘log.txt’,”rb”);

　　$fp = @fopen(‘../log.txt’,”rb”);

　　$fp = @fopen(“http://www.runer.com.cn/default.htm”,”rb”);//还可以使用ftp和ghoper等协议，必须启用php.ini文件中的allow_url_fopen选项

2 关闭文件

　　使用fclose()关闭文件，

　　bool fclose ( resource handle )//关闭一个已打开的文件指针

3 读取文件

string fgets ( int handle [, int length] )从文件指针中读取一行，在二进制文件上尝试fgets会产生不可预测的结果

　　如果不指定长度，默认读取1K数据，碰到换行符（包括在返回值中）、EOF 或者已经读取了 length – 1 字节后停止

　　string fgetss ( resource handle [, int length [, string allowable_tags]] )从文件指针中读取一行并过滤掉 HTML 标记

　　fgetc()读取单个字符

　　fread()读取任意二进制数据

4 判断文件读取的状态

文件指针最初位于文件的开头（0），或者文件的末尾

　　feof()可以判断文件是否已经到末尾（到末尾后函数返回TRUE）

　　filesize()函数返回文件的大小

5 写入文件

fwrite()函数执行文件写入

　　对于二进制数据，必须指定第三个参数，它包含写入到磁盘的数据字节数

　　$result = @fwrite($fp,$binary_data,mb_strlen($binary_data,’8bit’));

6 文件权限和其他信息

　　is_readable()//判断文件是否可读

　　is_writeable()//判断文件是否可写

　　is_writable()//判断文件是否可写

　　fileperms()//判断文件的权限（UNIX风格的文件权限测试函数）

　　file_exists()//是否存在这个文件

　　fileowner()//判断文件所属用户

　　filegroup()//判断文件所属组

7 删除和重命名文件

　　unlink()//删除文件

　　rename()//重命名文件

8 访问目录

　　目录访问建议使用前向斜线”/”，兼容windows和unix系统

　　basename()//返回不包括路径信息的文件名

　　dirname()//返回文件名的目录部分

　　realpath()//接受相对路径，返回文件的绝对路径

　　pathinfo()//提取给定路径的目录名，基本文件名和扩展名

　　opendir()//打开目录，返回资源句柄

　　readdir()//读取目录项

　　rewinddir()//将读取指针返回开头

　　closedir()//关闭读取句柄

　　chdir()//改变当前脚本执行期间的当前工作目录

　　mkdir()//创建目录

　　rmdir()删除目录b

折腾了一天，撞鬼。想在商品列表中点击购买后弹出提示框，根据document.body.scrollTop设置显示位置，可偏偏失效。
原因：当网站做了以下声明时
<!--TYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.d-->

声明后document.body.scrollTop的值永远等于0，解决办法是只需把document.body用document.documentElement替换即可。

附：javascript中关于top、clientTop、scrollTop、offsetTop等

网页可见区域宽： document.body.clientWidth;
网页可见区域高： document.body.clientHeight;
网页可见区域宽： document.body.offsetWidth (包括边线的宽);
网页可见区域高： document.body.offsetHeight (包括边线的宽);
网页正文全文宽： document.body.scrollWidth;
网页正文全文高： document.body.scrollHeight;
网页被卷去的高： document.body.scrollTop;
网页被卷去的左： document.body.scrollLeft;
网页正文部分上： window.screenTop;
网页正文部分左： window.screenLeft;
屏幕分辨率的高： window.screen.height;
屏幕分辨率的宽： window.screen.width;
屏幕可用工作区高度： window.screen.availHeight;
屏幕可用工作区宽度：window.screen.availWidth;