<p>几乎所有的富 Web 应用都基于一个或多个 Web UI 库或框架,这些 UI 库与框架极大地简化了开发进程,并带来一致,可靠,以及高度交互性的用户界面。本文介绍了 15 个非常强大的 JavaScript Web UI 库,非常适合各种各种规模的富 Web 应用的开发。</p>
<h2 class="subtitle">LivePipe</h2>
<p><a href="http://livepipe.net/">LivePipe UI</a> 基于 <a href="http://www.prototypejs.org/">Prototype Javascript 框架</a>,包含了一整套经严格测试并高度可扩展的 UI 控件,拥有很好的文档,在不支持 JavaScript 的环境中,可以无缝降级使用。包括 Tab, 窗体,文本框,多选框,评分控件,进度条,滚动条,右键菜单等多种控件。</p>
<p><a href="http://livepipe.net/"><b>LivePipe</b> 首页与下载</a><br /> <a href="http://livepipe.net/control#rating"><b>LivePipe</b> 演示与示例</a></p>
<p><a href="http://livepipe.net/control#rating"><img src="http://speckyboy.com/wp-content/uploads/2010/05/webui_02.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2></h2>
<h2 class="subtitle">UKI</h2>
<p><a href="http://ukijs.org/"></a></p>
<p><a href="http://ukijs.org/">UKI</a> 是一套简单的 JavaScript UI 工具集,用于快速创建桌面风格的 Web 应用。包含的控件从滑动条,到分栏视图,不一而足。熟悉 <a href="http://jquery.com/">jQuery</a> 的开发者会发现这个工具很容易上手,非常简洁,无需安装框架,不依赖 CSS 引用。</p>
<p><a href="http://ukijs.org/"><b>UKI</b> 主页与下载</a><br /> <a href="http://ukijs.org/examples/"><b>UKI</b> 控件,演示,示例</a></p>
<p><a href="http://ukijs.org/examples/"><img src="http://speckyboy.com/wp-content/uploads/2010/05/webui_04.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">MochaUI</h2>
<p><a href="http://mochaui.com/"></a></p>
<p><a href="http://mochaui.com/">MochaUI</a> 是 <a href="http://mootools.net/">MooTools Javascript 框架</a> 与 ExplorerCanvas 的一个备受欢迎的扩展,可以用来快速创建 Web 应用,Web 桌面,网站,饰件,独立 Windows,Modal 对话框等等。</p>
<p><a href="http://mochaui.com/"><b>MochaUI</b> 主页与下载</a><br /> <a href="http://mochaui.com/demo/"><b>MochaUI</b> 控件,演示,示例</a></p>
<p><a href="http://mochaui.com/demo/"><img src="http://speckyboy.com/wp-content/uploads/2010/05/webui_06.jpg" style="border:0px;" /></a></p>
<p>中文编译来源:<a href="http://www.comsharp.com"><b>锐商企业CMS</b> 网站内容管理系统</a> 官方网站</p>
<h2 class="subtitle">Sigma Ajax UI Builder</h2>
<p><a href="http://sourceforge.net/projects/ajaxuibuilder/">SigmaVisual</a> 是一套基于 Web 的,所见即所得的 AJAX UI 创建工具,包含超过40个不见,如 Tab,对话框,树形图,时间线等,基于 JavaScript 和 PHP。</p>
<p><a href="http://sourceforge.net/projects/ajaxuibuilder/"><b>Sigma Ajax UI Builder</b> 主页和下载</a><br /> <a href="http://www.sigmawidgets.com/products/sigma_visual/VisualJS/index.html"><b>Sigma Ajax UI Builder</b> 控件,演示和示例</a></p>
<p><a href="http://www.sigmawidgets.com/products/sigma_visual/VisualJS/index.html"><img src="http://speckyboy.com/wp-content/uploads/2010/05/webui_08.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">JxLib based MooTools</h2>
<p><a href="http://jxlib.org/"></a></p>
<p><a href="http://jxlib.org/">JxLib</a> 是一个基于 <a href="http://mootools.net/">MooTools</a> 的 JavaScript UI 框架,包含多数 Web 程序都需要的基本空间,如按钮,Tab,菜单,树形结构,对话框等等。JxLib 还支持换肤功能。</p>
<p><a href="http://jxlib.org/"><b>JxLib</b> 主页与下载</a><br /> <a href="http://jxlib.org/"><b>JxLib</b> 控件,演示与示例</a></p>
<p><a href="http://jxlib.org/"><img src="http://speckyboy.com/wp-content/uploads/2010/05/webui_10.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">Dijit – The Dojo Toolkit</h2>
<p><a href="http://dojotoolkit.org/reference-guide/dijit/index.html"></a></p>
<p><a href="http://dojotoolkit.org/reference-guide/dijit/index.html">Dijit</a> 基于 <a href="http://www.dojotoolkit.org/">Dojo</a>,也是学习 Dojo 扩展的一个好起点。可以用来创建非常漂亮的 Web 2.0 GUI。支持多语种,甚至支持不同语种的文字书写方向以及本地化数字,日期等等。</p>
<p><a href="http://dojotoolkit.org/reference-guide/dijit/index.html"><b>Dijit</b> 主页,下载</a><br /> <a href="http://archive.dojotoolkit.org/nightly/dojotoolkit/dijit/themes/themeTester.html"><b>Dijit</b> 控件,演示,示例</a></p>
<p><a href="http://archive.dojotoolkit.org/nightly/dojotoolkit/dijit/themes/themeTester.html"><img src="http://speckyboy.com/wp-content/uploads/2010/05/webui_12.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">jQuery TOOLS</h2>
<p><a href="http://flowplayer.org/tools/index.html"></a></p>
<p><a href="http://flowplayer.org/tools/index.html">jQuery Tools</a> 是一个非常轻量(2.5kb)的常用 UI 库,支持以下 jQuery 对象,Tabs, 工具提示,滚动条,层,表单以及 Flash 嵌套。</p>
<p><a href="http://flowplayer.org/tools/index.html"><b>jQuery TOOLS</b> 主页与下载</a><br /> <a href="http://flowplayer.org/tools/demos/index.html"><b>jQuery TOOLS</b> 控件,演示,示例</a></p>
<p><a href="http://flowplayer.org/tools/demos/index.html"><img src="http://speckyboy.com/wp-content/uploads/2010/05/webui_14.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">jQuery UI</h2>
<p><a href="http://jqueryui.com/home"></a></p>
<p><a href="http://jqueryui.com/home">jQuery UI</a> 基于 <a href="http://jquery.com/">jQuery</a>,包含 3 个大类,饰件,一些内置的 UI 对象;效果,对各种网页对象施加动画效果(如爆炸效果);鼠标交互,如拖放操作。</p>
<p><a href="http://jqueryui.com/home"><b>jQuery UI</b> 首页与下载</a><br /> <a href="http://jqueryui.com/demos/"><b>jQuery UI</b> 控件,演示与示例</a></p>
<p><a href="http://jqueryui.com/demos/"><img src="http://speckyboy.com/wp-content/uploads/2010/05/webui_16.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">Prototype UI</h2>
<p><a href="http://www.prototype-ui.com/"></a></p>
<p><a href="http://www.prototype-ui.com/">Prototype UI</a> 基于 <a href="http://www.prototypejs.org/">Prototype</a> 与 <a href="http://script.aculo.us/">Script.aculo.us</a>,包括多个模块(旋转木马,Modal 窗口,阴影,右键菜单等),每个模块可以单独安装使用。</p>
<p><a href="http://www.prototype-ui.com/"><b>Prototype UI</b> 主页与下载</a><br /> <a href="http://docs.prototype-ui.com/rc0/Window"><b>Prototype UI</b> 控件,演示与示例</a></p>
<p><a href="http://docs.prototype-ui.com/rc0/Window"><img src="http://speckyboy.com/wp-content/uploads/2010/05/webui_18.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">Jitsu</h2>
<p><a href="http://www.jitsu.org/jitsu/index.html"></a></p>
<p><a href="http://www.jitsu.org/jitsu/index.html">Jitsu</a> 功能包括 XML 标记,页面编译,动画引擎,Ajax 以及运行时检测等等,它的 Ajax 功能使消费级 Web 应用的创建变得非常简单,支持客户端数据绑定,还可以将页面编译成 JavaScript,<a href="http://www.jitsu.org/jitsu/index.html">Jitsu</a> 在 Firefox 和 IE 中运行最佳。</p>
<p><a href="http://www.jitsu.org/jitsu/index.html"><b>Jitsu</b> 主页与下载</a><br /> <a href="http://www.jitsu.org/jitsu/quicktours/basic_helloworld.html"><b>Jitsu</b> 控件,演示与示例</a></p>
<p><a href="http://www.jitsu.org/jitsu/quicktours/basic_helloworld.html"><img src="http://speckyboy.specky.netdna-cdn.com/wp-content/uploads/2010/05/webui_20.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">Qutensil</h2>
<p><a href="http://qutensil.com/">Qutensil</a> 仍在开发中,但其路线图已经显示出某些引人注目的东西,基于 <a href="http://www.prototypejs.org/">Prototype</a> 与 <a href="http://script.aculo.us/">Scriptaculous</a> ,包含消息,调色板,滑动条,工具提示,可拖放窗口以及警告,确认,提示等窗口。</p>
<p><a href="http://qutensil.com/"><b>Qutensil</b> 主页,下载</a><br /> <a href="http://qutensil.com/pages/modules"><b>Qutensil</b> 控件,演示,示例</a></p>
<p><a href="http://qutensil.com/pages/modules"><img src="http://speckyboy.specky.netdna-cdn.com/wp-content/uploads/2010/05/webui_22.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">Script.aculo.us</h2>
<p><a href="http://script.aculo.us/">script.aculo.us</a> 是一个备受欢迎的 UI 工具集,基于 <a href="http://www.prototypejs.org/">Prototype 框架</a>,提供了诸如视觉效果,UI 控件以及面向 DOM 的工具。</p>
<p><a href="http://script.aculo.us/"><b>Script.aculo.us</b> 首页与下载</a></p>
<p><a href="http://wiki.github.com/madrobby/scriptaculous/demos"><img src="http://speckyboy.specky.netdna-cdn.com/wp-content/uploads/2010/05/webui_24.jpg" style="border:0px;" /></a></p>
<h2 class="subtitle">Alloy UI</h2>
<p><a href="http://alloy.liferay.com/">AlloyUI</a> 是一套功能丰富的 UI 框架,基于 YUI 3,部分基于 YUI 2,包含一套丰富的(超过60)UI 部件,如图片库,对话框,树形结构,面板,自动完成,按钮,日历控件,工具条等。</p>
<p><a href="http://alloy.liferay.com/"><b>Alloy UI</b> 首页和下载</a><br /> <a href="http://alloy.liferay.com/demos.php"><b>Alloy UI</b> 控件,演示与示例</a></p>
<p><a href="http://alloy.liferay.com/demos.php"><img src="http://speckyboy.specky.netdna-cdn.com/wp-content/uploads/2010/05/webui_26.jpg" style="border:0px;" /></a></p>
<p> </p>
<h2 class="subtitle">iUI: iPhone UI 框架</h2>
<p><a href="http://code.google.com/p/iui/"><img src="http://speckyboy.specky.netdna-cdn.com/wp-content/uploads/2010/05/webui_27.jpg" style="border:0px;" /></a><a href="http://code.google.com/p/iui/"></a></p>
<p><a href="http://code.google.com/p/iui/">IUI</a> 包含一套 JavaScript 库,CSS 式样表及图片,是一个轻量级 iPhone UI 库,包含 iPhone 风格导航菜单,设备方向,iPhone 风格切换等功能,可以为你的 Web 程序带来 iPhone 般的体验。</p>
<p><a href="http://code.google.com/p/iui/"><b>iUI</b> 主页与下载</a></p>
<h2 class="subtitle">XUI</h2>
<p><a href="http://xuijs.com/"><img src="http://speckyboy.specky.netdna-cdn.com/wp-content/uploads/2010/05/webui_29.jpg" style="border:0px;" /></a><a href="http://xuijs.com/"></a></p>
<p><a href="http://xuijs.com/">XUI</a> 是一个用于移动 Web 应用的轻量,极简,高度模块化的框架。它之所以非常轻量的原因是,它只支持移动浏览器,所有跨浏览器支持的代码都被剥离。它面向一线移动 Web 浏览器,如 Webkit,Fennec 以及 Opera,并有意将来对移动 IE 和黑莓提供支持。</p>
<p><a href="http://xuijs.com/"><b>XUI</b> 首页,下载</a></p>
<h2 class="subtitle">Yahoo! YUI Library</h2>
<p><a href="http://developer.yahoo.com/yui/"><img src="http://speckyboy.specky.netdna-cdn.com/wp-content/uploads/2010/05/webui_30.jpg" style="border:0px;" /></a></p>
<p><a href="http://developer.yahoo.com/yui/">Yahoo! YUI Library</a> 可谓所有 Web UI 之父,可靠,功能丰富,目前已经发展到第 3 版。它拥有一个很庞大的开发团队,推出了非常丰富的功能,就功能而言,无可匹敌。</p>
<p><a href="http://developer.yahoo.com/yui/"><b>YUI Library</b> 主页与下载</a><br /> <a href="http://developer.yahoo.com/yui/2/"><b>YUI2 入门</b></a><br /><a href="http://developer.yahoo.com/yui/3/"><b>YUI3 入门</b></a><br /> <a href="http://developer.yahoo.com/yui/3/"><b>YUI3</b> 控件,演示与示例</a></p>
<p>本文国际来源:Specky Boy <a href="http://speckyboy.com/2010/05/17/15-javascript-web-ui-libraries-frameworks-and-libraries/">15 Javascript Web UI Libraries, Frameworks and Toolkits</a></p>
<p>中文编译来源:<a href="http://www.comsharp.com"><b>锐商企业CMS</b> 网站内容管理系统</a> 官方网站</p>
分享到:
相关推荐
下面将详细介绍标题中提到的15个JavaScript Web UI库,以及它们的特点和优势。 1. **LivePipe**:基于Prototype JavaScript框架,提供了一套完整的、经过测试的UI控件,支持在没有JavaScript的环境下降级使用。包括...
WebUI 4.27版本的插件是针对Unreal Engine (UE4) 4.27更新的一个重要组成部分,专注于提升游戏开发中的用户界面体验。这个插件为UE4引入了先进的网页交互功能,使得开发者能够创建更加丰富、动态且具有高度定制化的...
而"UE4.26插件WebUI"则是一个专为UE4.26版本设计的插件,它允许开发者将Web页面与虚幻引擎的内容融合在一起,实现更加丰富的交互体验和可视化效果。 这个插件的核心功能在于提供了一个桥梁,让开发者可以利用HTML5...
WebUI意味着这是一个用于构建网页用户界面的工具集,而Angular是Google维护的前端JavaScript框架,强调可维护性和可测试性。WebUI4Angular结合了这两者,为Angular开发者提供了一套现成的、易于使用的界面组件。 ...
该插件的一个关键特性是其“穿透”功能,这允许WebUI不仅作为一个静态的展示层,而是能够直接与UE4的物理模拟、动画、AI等核心系统进行交互。例如,玩家在网页上做出的选择可以直接影响游戏中的事件,或者通过WebUI...
这个修复版是由开发者自行编译完成的,旨在克服官方版本的缺陷,确保前端WebUI与UE4客户端的无缝集成。 修复版的核心改进包括: 1. **穿透点击优化**:原版UE4可能存在点击事件处理不当的问题,使得用户在前端网页...
在"WEBUI窗口.rar"这个压缩包中,包含的是易语言的WEBUI窗口源码。易语言是一种面向对象、中文编程的编程语言,其目标是降低编程难度,使计算机技术更易于掌握。在WEBUI窗口的实现中,易语言提供了一套专门用于创建...
【标题】"sd-webui-mov2mov.zip" 指的可能是一个包含Web用户界面(Web UI)的项目,其主要功能可能是处理视频转换,特别是从一种名为"mov"的视频格式转换到同名的另一种格式。这个压缩包可能包含了项目的源代码、...
标题中的“可扩展的扩散Web UI”指的是一个设计灵活、功能可拓展且易于使用的Web应用程序界面,它旨在提供一个便携式的解决方案,让用户无论在何处都能无缝地访问和操作。这种UI设计思路在现代软件开发中至关重要,...
在易语言的WEBUI窗口中,这个函数可以帮助开发者实现半透明效果或者设置窗口的特定颜色,从而提升界面的视觉效果和用户体验。通过调整透明度,可以让WEBUI窗口与底层内容相互融合,创造出更现代和动态的界面。 在...
"WEBUI支持库"是一个专为Web用户界面(WEBUI)设计和开发提供辅助功能的软件库。这个库通常包含了各种组件、工具和框架,帮助开发者更高效地创建交互式的网页应用。它能够提高开发效率,减少代码重复,并提供统一的...
### 10个优秀的Web UI库框架 #### ITMill Toolkit **知识点:** - **开源性质:** ITMill Toolkit 是一款完全开源的 Web UI 框架,这意味着开发者可以自由地使用、修改并分发该框架。 - **目标:** 旨在为开发者...
本资源提供的是一个基于易语言开发的网站后台管理UI界面的源码,结合了CEF(Chromium Embedded Framework)和WEBUI技术,实现了自适应的界面设计。 CEF是Google Chromium浏览器引擎的一个开源版本,可以被嵌入到...
描述中提到的经典WebUI和登录窗口,意味着这可能是一个经过时间考验、具有良好用户反馈的设计方案。它包含了截图和实例,这些对于开发者来说是非常有价值的参考资料,因为它们可以直观地展示设计效果,并提供实际的...
《手机Web UI框架详解——以layer.mobile-v1.2为例》 在当今互联网技术日新月异的时代,手机Web UI框架扮演着至关重要的角色。它们为开发者提供了构建响应式、高性能且用户友好的手机网站的工具,大大提升了开发...
jQuery是一个高效的JavaScript库,它简化了DOM操作、事件处理、动画制作和Ajax交互。在Web UI框架中,jQuery通常是核心组件,因为它的简洁API使得开发者可以快速实现复杂功能,例如,通过$.ajax()方法轻松进行异步...
在Web开发领域,JavaScript库和框架提供了许多实现选项卡功能的方法。这里我们将深入探讨“ui.tabs”这一主题,重点关注JavaScript和UI设计的相关知识点。 一、JavaScript基础 JavaScript是一种脚本语言,广泛应用...
WebUI-Popover是基于流行的JavaScript库jQuery构建的,因此,使用这个插件的前提是您的项目已经引入了jQuery。其设计目标是轻量且灵活,可以方便地与其他前端框架结合,如Bootstrap,同时提供了多种样式和配置选项,...
标题 "使用bash命令从WebUI控制和监视任何GNULinux系统" 暗示了我们正在探讨一种通过Web用户界面(Web UI)来管理和监控Linux系统的方法,这种方法可能利用了Bash shell脚本的威力。Bash是GNU/Linux操作系统中的默认...