从零开始学习jQuery(10)jQuery yui常用函数的实际应用

一.摘要

本系列文章将带您进入jQuery的奇妙世界，其中有许多作者的具体经验和解决方案。即使可以使用jQuery，也能在阅读中发现一些骗子。这篇文章是一篇实用文章。网站的大部分常用功能都是使用jQueryUI完成的。第二，序言由公司内部收集。整理了一些经常用javascript实现的功能。这些功能的主角不是眼花缭乱的jQuery插件，而是jQuery UI。如果你还在为一个小特效下载安装插件，发现还没有人为你解决Bug。请记住，插件是我们最后的选择。使用插件有太多的缺点。1.不利于维修。2.增加页面大小。3.不利于成员间的交流分享，有学习成本。4.不够健壮。不能保证插件版本会一直更新，所有问题都会修复。这里介绍一下今天的主角：jQuery UI

三.jQuery UI

jQuery UI，这是jQuery的一部分，也是专门用于UI交互的一套类库。使用jQuery ui可以实现底层交互，各种高级特效、动画，并且主题可以自定义。我们可以很容易地用它构建高度交互的网络应用程序。官方主页： http://jqueryui.org/下载： http://jqueryui.com/download示例和文档： http://jqueryui.com/demos/.皮肤： http://jqueryui.com/themeroller/jQuery UI的在线网站非常强大。首先可以组装自己想要定制的功能，下载时下载：。

此外，针对各种控件提供了详细的参数描述和示例，示例的皮肤：可以随时更改。

本文主要讲解示例，通过示例代码可以快速上手jQuery UI。有了jQuery UI，我们可以在不使用其他插件的情况下完成大部分页面应用，说它是官方的超级UI插件也不为过。包含所有函数的jQuery UI类库文件为188K。启用Gzip压缩后，为45K。虽然很大，但是一次加载整个网站还是有好处的。而且，45K的大小在如今的互谅网络时代是可以接受的。目前还没有jQuery UI的中文教程。因为这篇文章是一篇实用的文章，所以，我就不仔细讲解基本内容了。在接下来的章节中，我将加入jQuery UI的基础教程，力争成为中文jQuery UI的第一个教程。从010到1010，我会提交所有相关文件，包括各种类库文件，主题模板放在如下路径：http://www.dotnetapi.com/JSLib/,这里启用了目录浏览，可以直接找到需要的文件。目录组织结构按照本系列的： (VIII)中断：jQuery实现中介绍的方案组织。此外，文件可以从谷歌参考。谷歌的CDN更快，更有保障。参考：谷歌的CDN。本文中的所有引用都使用属性WebConfig。ResourceServer 3360公共类web config { public static string resources erver=@ ' http://www.dotnetapi.com/'; }

四. 准备工作

弹出框是最常用也是最实用的功能。让我们看看鳄龙的一些应用场景。

五.弹出层对话框

1. 艺龙网应用场景举例

。

(1) 静态提示类弹出层. 弹出层的内容是固定的.

(2) 动态提示类弹出层. 弹出层内容是根据事件源变化的.

00-1010使用jQuery UI的对话框组件。我很容易达到以上三种效果。Dialog组件的主要特点是可以拖动和调整大小。示例的完整代码如下：%@页面语言='C#'%！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML 1-Transitional . DTD ' html xmlns=' http://www . w3 . org/1999/XHTML ' head id=' head 1 ' runat=' server ' title jquery ui-popup layer application instance Dialog/title！-黑色领带，闪电侠，闪电侠，点爱，刺激自行车，热靴，人性，薄荷巧克力，红色