<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...
UE WebUI 5.3的插件打包功能可能允许开发者将他们的插件代码整合成一个或多个可部署的文件,这可以极大地提升项目的维护性和部署效率。 2. **工作流优化**:支持打包意味着UE WebUI现在可能拥有一个内置的构建系统...
该插件的一个关键特性是其“穿透”功能,这允许WebUI不仅作为一个静态的展示层,而是能够直接与UE4的物理模拟、动画、AI等核心系统进行交互。例如,玩家在网页上做出的选择可以直接影响游戏中的事件,或者通过WebUI...
WebUI意味着这是一个用于构建网页用户界面的工具集,而Angular是Google维护的前端JavaScript框架,强调可维护性和可测试性。WebUI4Angular结合了这两者,为Angular开发者提供了一套现成的、易于使用的界面组件。 ...
这个修复版是由开发者自行编译完成的,旨在克服官方版本的缺陷,确保前端WebUI与UE4客户端的无缝集成。 修复版的核心改进包括: 1. **穿透点击优化**:原版UE4可能存在点击事件处理不当的问题,使得用户在前端网页...
在"WEBUI窗口.rar"这个压缩包中,包含的是易语言的WEBUI窗口源码。易语言是一种面向对象、中文编程的编程语言,其目标是降低编程难度,使计算机技术更易于掌握。在WEBUI窗口的实现中,易语言提供了一套专门用于创建...
标题中的“可扩展的扩散Web UI”指的是一个设计灵活、功能可拓展且易于使用的Web应用程序界面,它旨在提供一个便携式的解决方案,让用户无论在何处都能无缝地访问和操作。这种UI设计思路在现代软件开发中至关重要,...
【标题】"sd-webui-mov2mov.zip" 指的可能是一个包含Web用户界面(Web UI)的项目,其主要功能可能是处理视频转换,特别是从一种名为"mov"的视频格式转换到同名的另一种格式。这个压缩包可能包含了项目的源代码、...
"WEBUI支持库"是一个专为Web用户界面(WEBUI)设计和开发提供辅助功能的软件库。这个库通常包含了各种组件、工具和框架,帮助开发者更高效地创建交互式的网页应用。它能够提高开发效率,减少代码重复,并提供统一的...
### 10个优秀的Web UI库框架 #### ITMill Toolkit **知识点:** - **开源性质:** ITMill Toolkit 是一款完全开源的 Web UI 框架,这意味着开发者可以自由地使用、修改并分发该框架。 - **目标:** 旨在为开发者...
本资源提供的是一个基于易语言开发的网站后台管理UI界面的源码,结合了CEF(Chromium Embedded Framework)和WEBUI技术,实现了自适应的界面设计。 CEF是Google Chromium浏览器引擎的一个开源版本,可以被嵌入到...
描述中提到的经典WebUI和登录窗口,意味着这可能是一个经过时间考验、具有良好用户反馈的设计方案。它包含了截图和实例,这些对于开发者来说是非常有价值的参考资料,因为它们可以直观地展示设计效果,并提供实际的...
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操作系统中的默认...
本项目为基于Python和JavaScript的stable-diffusion-webui AI画图工具的完整源码集合,共计108个文件,涵盖67个Python脚本、15个JavaScript文件、8个文本文件、4个Markdown文件、3个PNG图片、2个YAML文件、2个批处理...