学习要点:
1.项目介绍
2.jQuery UI
3.UI 主题
知问系统,是一个问答系统。主要功能:即会员提出问题,会员回答问题。目前比较热门的此类网站有:知乎 http://www.zhihu.com、百度知道 http://zhidao.baidu.com/等。这里我们重点参考“知乎”,来学习一下它采用的前端效果。
一.项目介绍
我们重点仿照“知乎”的架构模式来搭建界面和布局,以及大部分前端功能。而“百度知道”作为辅助功能来确定我们这个项目需要的前端功能。
从以上知名问答站点中,我们可以确认最主要的前端功能: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(jQueryUI 的文档文件)、themes(CSS 主题文件)和 ui(jQuery ui 的 JavaScript 文件)。
4.Index.html,可以查看 jQuery UI 功能的索引页。
三.CSS 主题
CSS 主题就是 jQuery UI 的皮肤,有各种色调的模版提供使用。对于程序员,可以使用最和网站符合的模版;对于美工,也提供了没有任何样式的模版基于设计。
我们可以在这里:http://jqueryui.com/themeroller/查看已有模版样式。
- 浏览: 311042 次
- 性别:
- 来自: 广州
-
最新评论
-
chaoyi:
bitray 写道这不是做了set的操作嘛?没发现是自动映射啊 ...
JavaBean与表单 -
huwen_hua:
Servlet简介 -
bitray:
这不是做了set的操作嘛?没发现是自动映射啊?
JavaBean与表单 -
chaoyi:
wellkingsen 写道共享源码?凑合看看,找不到源码了。 ...
Jsp小项目总结 -
wellkingsen:
共享源码?
Jsp小项目总结
相关推荐
第8章 jQuery UI插件/242 8.1 认识jQuery UI /243 8.2 jQuery UI交互性插件/244 8.2.1 拖曳插件/244 8.2.2 放置/247 8.2.3 排序插件/250 8.3 jQuery UI微型插件/252 8.3.1 折叠面板插件/252 8.3.2 日历/255...
jQuery EasyUI 是一个基于 jQuery 的前端开发框架,它提供了一系列的 UI 组件,如对话框、表格、菜单、按钮等,帮助开发者快速构建具有专业外观的 Web 应用程序。这个模板是为初学者和有经验的开发者设计的,旨在...
《15天学会jQuery》教程概述 jQuery是一个广泛使用的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画制作以及Ajax交互。本教程旨在帮助初学者在短短15天内快速掌握jQuery的核心概念和实用技巧。 ...
#### 一、Web前端技术概述 - **HTML5**: 超文本标记语言的第五代标准,提供了更多的语义标签和多媒体支持,如`<article>`、`<section>`、`<video>`等。 - **CSS3**: 层叠样式表的第三个版本,引入了新的选择器、伪...
《10天学会jQuery》教程概述 jQuery是一个广泛使用的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画制作以及Ajax交互。本教程旨在帮助你在短短的10天内掌握jQuery的核心概念和实用技巧,使你...
### jQuery应用程序架构设计工具 #### 一、概述 在当今高度动态且复杂的Web开发环境中,JavaScript框架和库的出现极大地简化了开发流程。其中,jQuery因其简洁易用的API而广受欢迎,但随着项目规模的增长,仅依靠...
本文将对前端架构体系技术进行概述,涵盖 Bootstrap 框架设计、响应式布局、第三方插件管理、MVC/MVVM 框架原理设计、数据绑定、Virtual DOM、 Incremental DOM 等多个方面。 一、框架与组件设计 在前端架构体系...
### Web前端工程师培训课程知识点概览 #### 一、课程背景与目标 - **背景**:根据《上海互联网行业人才紧缺指数(TSI)报告》,Web前端开发工程师是上海互联网行业中非常紧缺的职位之一。该职位不仅需求量大,而且...
- **整合第三方jQuery插件**:提供了一套标准的方法来引入和使用第三方插件,确保与DWZ框架兼容。 - **错误加载XML文档**:遇到此类问题时,检查XML文件的路径和格式是否正确。 - **IIS访问*.html页面的问题**:配置...
第16章 脚本化css 410 16.1 css概览 411 16.2 重要的css属性 416 16.3 脚本化内联样式 427 16.4 查询计算出的样式 431 16.5 脚本化css类 433 16.6 脚本化样式表 436 第17章 事件处理 440 17.1 事件类型 442 17.2 ...
#### 一、Ruby on Rails 概述 - **定义**: Ruby on Rails(简称 Rails 或 RoR)是一种基于 Ruby 语言的 Web 应用开发框架,采用 Model-View-Controller(MVC)架构模式。 - **特点**: - 遵循“约定优于配置”原则...
#### 十七至十九章 实战案例分析 - **投票管理系统**:通过一个投票管理系统的实例,展示Struts2与其他技术(如Hibernate、Spring)的集成应用。 - **无纸化办公管理系统**:介绍如何利用Struts2框架构建一个无纸化...
04 UI设计(第2阶段内容) 05 AP原型 06 阶段项目02 07 JavaScript核心编程 08 DOM编程 09 阶段项目03 10 服务器端开发技术 11 HTTP协议 12 HTML5高级 13 阶段项目04 14 JQUERY 15 AJAX 16 阶段项目05 17 Bootstrap ...
- **前端技术**:JSP/JSTL/taglib、Apache Tiles 3.0.5、AmazeUI、Displaytag等。 - **其他**:JDBC/Druid连接池、JavaScript/jQuery/JSON/XML、JavaMail、Log4j/SLF4j、Solr/Lucene全文检索等。 #### 十、功能模块...
第十一章对比分析了几种流行的移动UI框架,如jQuery Mobile、Sencha Touch等,帮助开发者选择最适合项目的工具。 **11. 应用发布前的打磨与封装** 第十二章介绍了在发布Web应用之前需要注意的一些细节,包括性能...
- **Action**:处理用户请求的核心类,负责业务逻辑处理及数据模型的构建。 - **视图**:如JSP或Freemarker模板,用于展示数据给用户。 - **模型**:通常是指JavaBean,用来封装业务数据和逻辑。 - **配置文件**...
- **Ext2概述**:介绍了EXT的第二个版本的主要特点和新增功能。 - **组件模型**:详细讲解了EXT中组件的生命周期、状态管理等内容。 - **容器模型**:解释了容器如何管理和组织其内部的子组件。 - **布局**:介绍了...