第一百七十七节，jQuery，知问前端--概述及 jQuery UI

jQuery，知问前端--概述及 jQuery UI

 

学习要点：

　　1.项目介绍

　　2.jQuery UI

　　3.UI 主题

 

一．项目介绍

我们重点仿照“知乎”的架构模式来搭建界面和布局，以及大部分前端功能。而“百度 知道”作为辅助功能来确定我们这个项目需要的前端功能。 从以上知名问答站点中，我们可以确认最主要的前端功能：1.弹出对话框；2.前端按钮； 3.折叠菜单；4.选项卡切换；5.滑动块；6.日历；7.自动补全；8 拖放；等一系列前端模块。

 

二．jQuery UI

jQuery UI 是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库。包含底层用户 交互、动画、特效和可更换主题的可视控件。我们可以直接用它来构建具有很好交互性的 web 应用程序。 jQuery UI 的官网网站为：http://jqueryui.com/，我们下载最新版本的即可。目前本课采 用的最新版本为：jquery-ui-1.10.3.custom.zip。里面目录结构如下：

1.css，包含与 jQuery UI 相关的 CSS 文件；

2.js，包含 jQuery UI 相关的 JavaScript 文件；

3.Development-bundle，包含多个不同的子目录：demos(jQuery UI 示例文件)、docs(jQuery UI 的文档文件)、themes(CSS 主题文件)和 ui(jQuery ui 的 JavaScript 文件)。 4.Index.html，可以查看 jQuery UI 功能的索引页。

 

三．CSS 主题

CSS 主题就是 jQuery UI 的皮肤，有各种色调的模版提供使用。对于程序员，可以使用 最和网站符合的模版；对于美工，也提供了没有任何样式的模版基于设计。 我们可以在这里：http://jqueryui.com/themeroller/查看已有模版样式

 

主讲：jquery-ui-1.10.3.custom

使用jquery-ui时

首先引入jquery

在引入jquery-ui

然后引入jquery-ui的css文件，也就是主题