jQuery Tools:Web开发必备的 jQuery UI 库
基本介绍
jQuery Tools 是基于 jQuery 开发的网站界面库,包含网站最常用的Tabs(选项卡)、Tooltip(信息提示)、Overlay(遮罩、弹窗)、Scrollable(滚动控制)、Form Validator(表单验证)、Rangeinput(范围选择)、Dateinput(日期选择)等众多功能。jQuery Tools 提供了高自定义的API接口,能够帮助开发者非常容易的实现所需要的功能,带给用户更佳的使用体验。
相比 jQuery UI,jQuery Tools 提供了作为网站应用更需要使用的功能,jQuery Tools 提供的功能分为三部分,分别是 UI Tools,Form Tools 和 Tools Box,下面会对每个功能模块分别作介绍,另外 jQuery Tools 要比 jQuery UI 的界面更精美,可定制性更好。除此之外,jQuery Tools 核心代码使用 GZIP 压缩后只有3.9KB,及时包括搜有的扩展功能也才14KB,要比 jQuery UI 轻量很多。
UI Tools
UI Tools 部分包括Tabs、Tooltip、Overlay和Scrollable四个功能模块,各功能模块的Demo如下:
Tabs(选项卡)
- Minimal setup for tabs
- Naming the tabs
- 4 different skins with CSS
- Using mouseover to switch tabs
- Making wizards with the tabs
- Making accordions with tabs
- Customizing the accordion effect
- Horizontal accordion using the tabs
- Multiple tabs and accordion instances
- Handling browsers back button
- Loading tab contents with ajax
- AJAXed tabs with history support
- Slideshow plugin for the tabs
Tooltip(信息提示)
- Basics of using the tooltip
- Using any HTML inside the tooltip
- Imitating browsers default tooltip
- Using tooltips in form fields
- Using tooltips in tables or lists
- Custom tooltip effect
- Dynamic positioning of the tooltip
Overlay(遮罩、弹窗)
- Minimal setup for overlay
- The apple effect for overlay
- Creating modal dialogs with overlay
- Opening overlays programmatically
- Overlays with different styles
- Loading external pages into overlay
- Multiple overlays on the same page
- Creating a customized overlay effect
Scrollable(信息滚动)
- Minimal setup for scrollable
- A vertical scrollable
- A simple scrollable image gallery
- Gallery with multiple scrollables
- A scrollable registration wizard
- Scrollable plugins in action
- Browser back button navigation
- jQuery tools home page setup
- A complete navigational system
- Add and remove items from scrollable
- Customizing the scrolling animation
Form Tools
Form Tools 部分包括Validator、Rangeinput和Dateinput三个功能模块,各功能模块的Demo如下:
Validator(表单验证)
- Minimal setup for validator
- Custom input types and attributes
- Server & client-side validation
- Error Summary
- Validator events in action
- Localizing the validator
Rangeinput(范围选择)
- Minimal setup for rangeinput
- A couple of vertical ranges
- Multiple small ranges
- A custom scrollbar for a DIV
Dateinput(日期选择)
- Minimal setup for dateinput
- A large skin for Dateinput
- Customizing Dateinput behavior
- Prompting for start and end dates
- Calendar that is always available
- Localizing the Dateinput (french)
Tools Box
Tools Box 部分包括Expose、Flashembed和Combinations三个功能模块,各功能模块的Demo如下:
Expose(突出重点)
Flashembed(嵌入Flash)
- Basics of Flash embedding
- Flashembed and jQuery
- Loading flash on a mouse click
- Placing HTML on top of a flash object
- Handling old flash versions
- Flashembed and Flowplayer
Combinations(整合功能)
jQuery Tools:Web开发必备的 jQuery UI 库的更多相关文章
- Snap.svg – 现代 Web 开发必备的 JavaScript SVG 库
SVG 是一种很好的 Web 技术方案,可以用来创建互动,在任何大小的屏幕上都会很好看.与分辨率无关的矢量图形.而这里推荐的 Snap.svg 这个 JavaScript 可以让你像 jQuery 操 ...
- HubSpot – 网站开发必备的 jQuery 信息提示库
HubSpot 一款功能丰富的 jQuery 消息提示插件.它可以帮助你个性化显示您的应用程序的事务性消息.您可以轻松地包裹 Ajax 请求进度,成功和错误消息,还可以添加操作链接到您的消息中. Hu ...
- modern.IE – Web 开发必备的 IE 浏览器测试工具
modern.IE 是微软推出的一个开发人员中心,提供免费的工具和资源,旨在使您能够花更少的时间来测试各种版本的 Internet Explorer,并留出更多时间在现代 Web 上构建重要的内容.m ...
- Normalize.css – 现代 Web 开发必备的 CSS resets
Normalize.css 是一个可定制的 CSS 文件,使浏览器呈现的所有元素,更一致和符合现代标准.它正是针对只需要统一的元素样式.该项目依赖于研究浏览器默认元素风格之间的差异,精确定位需要重置的 ...
- 移动 Web 开发必备!时尚的 Off Canvas 导航
这里向大家分享一组创新的 Off Canvas 导航效果.Off Canvas 导航在一些移动应用程序中被广泛使用.当你点击汉堡按钮(一般是三条横线组成)时,在左侧或者右侧拉出一个菜单,这样可以充分利 ...
- 第十六章:Python の Web开发基础(三) jQuery与Ajax
本課主題 jQuery 介绍 Ajax 介绍 jQuery 介绍 选择器 jQuery 的选择器分不同的种类,主要目的是用来查找目标的 HTML 标签,方便对目标标签进行操作,比如找到 <li& ...
- Web开发必备资源汇总[转]
导读:原文来自< Best “must know” open sources to build the new Web>,译文由酷壳网陈皓整理编译< 开源中最好的Web开发的资源 & ...
- java web开发必备知识
从各种招聘网站的要求上筛选出了一些java开发的一些基本的要求,对照自身看看有哪些缺陷. java基础 既然是java web开发,java SE肯定要学好了. 多线程,IO,集合等,对队列,缓存,消 ...
- 让人一用钟情的VS插件系列之一——Web Essentials(Web开发必备利器)
返回VS插件总目录 本篇目录 初识Web Essentials 看国外大牛如何评价Web Essentials Web Essentials下载与安装 Web Essentials涉及到了哪些内容 初 ...
随机推荐
- hdoj 2094 产生冠军
产生冠军 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submis ...
- 使用ViewPager实现三个fragment切换
新建一个android项目 先展示效果吧 首先看myfragmentPagerAdater这个类的代码 package com.example.viewpager; import java.util. ...
- DataGridView 选中行 分类: DataGridView 2015-01-22 09:07 51人阅读 评论(0) 收藏
说明: (1)命名 DataGridView 名称:dgvStockFirst 行索引:recordIndex (2)设置DataGridView属性: SelectionMode=FullRowSe ...
- (二)windows下安装PHPCMS V9
一.准备工作 搭建环境 :参考:Windows下搭建PHP开发环境及相关注意事项 PHPCMS V9 :下载适合自己 PHPCMS V9 版本到本地或服务器,下载地址:http://www.phpcm ...
- Android之打开闪光灯关键代码
在AndroidManifest中注册相应的权限: <uses-permission android:name="android.permission.FLASHLIGHT" ...
- ajax jsonp跨域处理问题
客户端 html $.ajax({ type : "get", async:false, dataType : "jsonp", jsonp: "js ...
- UVa 10400 - Game Show Math 游戏中的数学 dfs+判重
题意:给出一些数字和一个目标数字,要求你在数字间添加+-*/,让表达式能达到目标数字,运算符号的优先级都是一样的. 由于数据量很大,本来想用map<string>判重的,结果还是超时了,然 ...
- [AngularJS + Webpack] Uglifying your JavaScript
Angular requires some careful consideration when uglifying your code because of how angular's depend ...
- [转] Mac 下 PostgreSQL 的安装与使用
在 mac 下,可以利用 homebrew 直接安装 PostgreSQL: 1 brew install postgresql -v 稍等片刻,PostgreSQL 就安装完成.接下来就是初始数据库 ...
- Fragment之我的解决方案:Fragmentation
Fragment系列文章:1.Fragment全解析系列(一):那些年踩过的坑2.Fragment全解析系列(二):正确的使用姿势3.Fragment之我的解决方案:Fragmentation 如果你 ...