JQuery UI 框架

来源：互联网发布：php mktime 编辑：程序博客网时间：2024/05/16 23:33

1、jQuery的界面插件 Ninja UI

Ninja UI，是一款界面插件，使用它将能给你的项目增色不少。此插件包含有幻灯，智能提示等常见的效果。

目前的文档还不是很全，但是官方提供的例子已经很详细了，所以也是很容易使用的。

在线演示：http://ninjaui.com/examples

2、jQuery的UI框架 Chico UI

和 jQuery UI 一样，Chico UI 包含 auto-complete, blink, carousel, countdown, date-picker, dropdown,expand, calendar 等诸多逐渐，同时还提供一个 CSS 布局框架，用于实现网页布局和表格。

3、jQuery UI组件 jQuery UI

jQuery UI 是一套 jQuery 的页面 UI 插件，包含很多种常用的页面空间，例如 Tabs（如本站首页右上角部分）、拉帘效果（本站首页左上角）、对话框、拖放效果、日期选择、颜色选择、数据排序、窗体大小调整等等非常多的内容。

下面是一些 jQuery UI 的效果图：

4、jQuery的UI工具包 jQuery Tools

jQuery Tools 是一个当前网站开发中最最常用的UI组件集合，包括：Tab、工具提示ToolTip、窗口滚动、Overlap、Expose和Flash嵌入，jQuery Tools 只有 5.8k 大小（强烈推荐）。

下图是一个跳格控制的截图

上面效果实现的代码：

<!-- the tabs --> 
<ul class="tabs"> 
    <li><a href="#">Tab 1</a></li> 
    <li><a href="#">Tab 2</a></li> 
    <li><a href="#">Tab 3</a></li> 
</ul> 
 
<!-- tab "panes" --> 
<div class="panes"> 
    <div>First tab content. Tab contents are called "panes"</div> 
    <div>Second tab content</div> 
    <div>Third tab content</div> 
</div>
$(function() { 
    // setup ul.tabs to work as tabs for each div directly under div.panes 
    $("ul.tabs").tabs("div.panes > div"); 
});

在线演示 http://jquerytools.org/

5、jQuery的UI组件 EasyUI

jQuery easyui 为网页开发提供了一堆的常用UI组件，包括菜单、对话框、布局、窗帘、表格、表单等等逐渐，

下图是一个具有布局效果的窗口：

6、jQuery的UI框架 Liger UI

LigerUI是基于jQuery开发的一系列控件组，包括表单、布局、表格等等常用UI控件使

用LigerUI可以快速创建风格统一的界面效果

7、jQuery UI.Layout

这是一个模仿ExtJS区域布局(Border Layout)实现的jQuery UI页面布局管理器。简单易于使用，东南西北中5个区域可以嵌套使用，外观可以通过CSS控制。

8、jQuery的UI插件 Smart UI

JQuery Smart UI是基于JQuery的Ajax开发框架，实现前、后台分离、功能和数据分离，UI层全部使用htm+js+json完成，通过一个统一数据接口与服务端进行数据交换。

主要有三部分组成：

一套日常应用的JQuery插件(类似JQuery UI,JQuery EasyUI)，核心基于template.js模板插件,具有强大的自定义功能。

一套前端开发框架（js、css），满足各种基本场景，有着不错的封装、扩展性。系统自动完成动态创建页面，与后台交互，取、赋值等繁琐的操作。

例：查询场景，其中查询条件区域、列表区域，数据格式化都是通过简单的配置和方法动态生成。

与Smart UI无缝结合的后台数据框架（.net）。

统一数据交互接口，便于统一管理和维护。
FnCode的方式，权限控制到每个方法。
在开源框架【NBearLite】的基础上扩展，使用“结构实体”来解析前台的Json数据，避免了ORM中实体的反射转换的性能消耗。
数据库操作实现读写分离，分别用不同类实现；结合“结构实体”自动的绑定回发的数据，使用更加便捷。
多种数据库支持和支持多数据库；

9、HTML的Web框架 Angular JS

AngularJS 是一组用来开发Web页面的框架、模板以及数据绑定和丰富UI组件。它支持整个开发进程，提供web应用的架构，无需进行手工DOM操作。 AngularJS很小，只有60K，兼容主流浏览器，与 jQuery 配合良好。

10、jQuery UI组件集 Wijmo

Wijmo是一个jQuery UI组件集，有超过30多个jQuery UI 组件；这将是一个CSS3，SVG，HTML5的混合物，目前还处于Beta阶段。

11、快速开发WebUI jQuery MiniUI

快速开发：使用Html配置界面，减少80%界面代码量。
易学易用：简单的API设计，可以独立、组合使用控件。
性能优化：内置数据懒加载、低内存开销、快速界面布局等机制。
丰富控件：包含表格、树、数据验证、布局导航等超过50个控件。
超强表格：提供锁定列、多表头、分页排序、行过滤、数据汇总、单元格编辑、详细行、Excel导出等功能。
第三方兼容：与ExtJS、jQuery、YUI、Dojo等任意第三方控件无缝集成。
浏览器兼容：支持IE6+、FireFox、Chrome等。
跨平台支持：支持Java、.NET、PHP等。

12、jQuery的UI框架 angela UI

很抱歉，ANGELA UI已很长时间没有更新，这段时间我都比较忙，而且当初只是兴趣写一下，可能让很多关注它的同行失望。
现在带给大家一个好消息，这个UI将重写，将改为以类的形式实现，css改为less的形式，js改用coffee来写，敬请期待~。

基于jQuery的UI,最新版本0.7.1，新增tree, grid, scrollBar, tip等，服务器开启gzip压缩，jquery.angela.min.js：30KB,jquery.angela.min.css：6KB。

13、jquery常用ui(dialog...) jquery widget

几个 jquery 常用 ui 组件

弹出框:dialog 支持ajax内容，iframe,指定html代码

警告框:alert

页面提示：msg

拖动支持：drag

位置固定：使ie 6 也支持 position:fixed 属性

选项卡切换：tab

14、Interface.js

Interface是一个丰富的界面组件的集合，其利用轻量级JavaScript库jQuery。有了这个组件，您可以建立富客户端应用。

Interface拥有MIT和GTL两个协议，基本上意味着您可以在用在商业和非商业。只要您保持interface每个文件的版本。

示例代码

window.onload =
function()
{
$('#carousel').Carousel(
{
itemWidth: 110,
itemHeight: 62,
itemMinWidth: 50,
items: 'a',
reflections: .5,
rotationSpeed: 1.8
}
);
}
HTML

CSS
#carousel
{
width: 700px;
height: 150px;
background-color: #111;
position: absolute;
top: 200px;
left: 100px;
}
#carousel a
{
position: absolute;
width: 110px;
}

15、jQuery的UI组件包 jQWidgets

jqxWidgets 是一个复杂的、创新的 UI 部件库，基于 jQuery 开发，可让用户开发非常专业的、跨浏览器支持的 Web应用，主要特点：

Feature complete widgets for jQuery
Rich functionality and great performance.
Search-engine friendly.
Quick to download, easy to setup, well supported and well documented.
4 major quarterly releases.
Guaranteed 24h support time for licensed developers Mon-Fri.
Outstanding technical assistance provided by software developers.
Free fully functional Download.
Free upgrades for a full calendar year.
Easy CSS styling.
Ready to use, built-in Themes
Unique and completely customizable architecture for JQuery widgets.
Multiple code samples are provided to accelerate your learning.

在线演示：http://www.jqwidgets.com/jquery-widgets-demo/

16、轻量级的JS的UI框架 UIKIt

UIKit 是一个小型的、灵活的 JavaScript 的 UI 框架，压缩后只有 4K 大小。提供的UI组件包括：对话框、确认、颜色选择、翻转卡、上下文菜单以及提醒框等等。

17、jQuery的Widget构造器 Fluqi

Fluqi为jQuery提供了一个通用的微件（Widget）构造器，让用户以可视化方式创建并定制jQuery微件，然后可以把生成的标记语言代码和JavaScript用在自己的应用中。它还提供.NET API，其接口易于使用，而且可以在服务器端代码中配置jQuery控件。

Fluqi微件构造器能让用户预览配置的微件，生成对应的C#和HTML+JavaScript代码。你可以选择在ASP.NET中使用，如果是其他Web框架可使用后者。

在线演示：
http://fluqi.apphb.com/WebForms/QuickDemo.aspx
http://fluqi.apphb.com/Demo/Wizard

18、迷你Web的UI组件库 minjs

minjs 是一组轻量级的 jQuery 组件，提供多种 Web 常用组件，包括表单、表格、日历等，其中迷你表单帮助你使用 HTML5 表单增强，尽管浏览器不一定支持也可以使用。