基本介绍

  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(选项卡)

  1. Minimal setup for tabs
  2. Naming the tabs
  3. 4 different skins with CSS
  4. Using mouseover to switch tabs
  5. Making wizards with the tabs
  6. Making accordions with tabs
  7. Customizing the accordion effect
  8. Horizontal accordion using the tabs
  9. Multiple tabs and accordion instances
  10. Handling browsers back button
  11. Loading tab contents with ajax
  12. AJAXed tabs with history support
  13. Slideshow plugin for the tabs

  Tooltip(信息提示)

  1. Basics of using the tooltip
  2. Using any HTML inside the tooltip
  3. Imitating browsers default tooltip
  4. Using tooltips in form fields
  5. Using tooltips in tables or lists
  6. Custom tooltip effect
  7. Dynamic positioning of the tooltip

  Overlay(遮罩、弹窗)

  1. Minimal setup for overlay
  2. The apple effect for overlay
  3. Creating modal dialogs with overlay
  4. Opening overlays programmatically
  5. Overlays with different styles
  6. Loading external pages into overlay
  7. Multiple overlays on the same page
  8. Creating a customized overlay effect

  Scrollable(信息滚动)

  1. Minimal setup for scrollable
  2. A vertical scrollable
  3. A simple scrollable image gallery
  4. Gallery with multiple scrollables
  5. A scrollable registration wizard
  6. Scrollable plugins in action
  7. Browser back button navigation
  8. jQuery tools home page setup
  9. A complete navigational system
  10. Add and remove items from scrollable
  11. Customizing the scrolling animation

Form Tools

  Form Tools 部分包括Validator、Rangeinput和Dateinput三个功能模块,各功能模块的Demo如下:

  Validator(表单验证)

  1. Minimal setup for validator
  2. Custom input types and attributes
  3. Server & client-side validation
  4. Error Summary
  5. Validator events in action
  6. Localizing the validator

  Rangeinput(范围选择)

  1. Minimal setup for rangeinput
  2. A couple of vertical ranges
  3. Multiple small ranges
  4. A custom scrollbar for a DIV

  Dateinput(日期选择)

  1. Minimal setup for dateinput
  2. A large skin for Dateinput
  3. Customizing Dateinput behavior
  4. Prompting for start and end dates
  5. Calendar that is always available
  6. Localizing the Dateinput (french)

Tools Box

  Tools Box 部分包括Expose、Flashembed和Combinations三个功能模块,各功能模块的Demo如下:

  Expose(突出重点)

  1. Minimal setup for expose
  2. Styling the mask
  3. Exposing a form
  4. Exposing videos with a custom mask

  Flashembed(嵌入Flash)

  1. Basics of Flash embedding
  2. Flashembed and jQuery
  3. Loading flash on a mouse click
  4. Placing HTML on top of a flash object
  5. Handling old flash versions
  6. Flashembed and Flowplayer

  Combinations(整合功能)

  1. HTML5 form inside an overlay
  2. An artist’s portfolio
  3. Speeding up the portfolio

jQuery Tools:Web开发必备的 jQuery UI 库的更多相关文章

  1. Snap.svg – 现代 Web 开发必备的 JavaScript SVG 库

    SVG 是一种很好的 Web 技术方案,可以用来创建互动,在任何大小的屏幕上都会很好看.与分辨率无关的矢量图形.而这里推荐的 Snap.svg 这个 JavaScript 可以让你像 jQuery 操 ...

  2. HubSpot – 网站开发必备的 jQuery 信息提示库

    HubSpot 一款功能丰富的 jQuery 消息提示插件.它可以帮助你个性化显示您的应用程序的事务性消息.您可以轻松地包裹 Ajax 请求进度,成功和错误消息,还可以添加操作链接到您的消息中. Hu ...

  3. modern.IE – Web 开发必备的 IE 浏览器测试工具

    modern.IE 是微软推出的一个开发人员中心,提供免费的工具和资源,旨在使您能够花更少的时间来测试各种版本的 Internet Explorer,并留出更多时间在现代 Web 上构建重要的内容.m ...

  4. Normalize.css – 现代 Web 开发必备的 CSS resets

    Normalize.css 是一个可定制的 CSS 文件,使浏览器呈现的所有元素,更一致和符合现代标准.它正是针对只需要统一的元素样式.该项目依赖于研究浏览器默认元素风格之间的差异,精确定位需要重置的 ...

  5. 移动 Web 开发必备!时尚的 Off Canvas 导航

    这里向大家分享一组创新的 Off Canvas 导航效果.Off Canvas 导航在一些移动应用程序中被广泛使用.当你点击汉堡按钮(一般是三条横线组成)时,在左侧或者右侧拉出一个菜单,这样可以充分利 ...

  6. 第十六章:Python の Web开发基础(三) jQuery与Ajax

    本課主題 jQuery 介绍 Ajax 介绍 jQuery 介绍 选择器 jQuery 的选择器分不同的种类,主要目的是用来查找目标的 HTML 标签,方便对目标标签进行操作,比如找到 <li& ...

  7. Web开发必备资源汇总[转]

    导读:原文来自< Best “must know” open sources to build the new Web>,译文由酷壳网陈皓整理编译< 开源中最好的Web开发的资源 & ...

  8. java web开发必备知识

    从各种招聘网站的要求上筛选出了一些java开发的一些基本的要求,对照自身看看有哪些缺陷. java基础 既然是java web开发,java SE肯定要学好了. 多线程,IO,集合等,对队列,缓存,消 ...

  9. 让人一用钟情的VS插件系列之一——Web Essentials(Web开发必备利器)

    返回VS插件总目录 本篇目录 初识Web Essentials 看国外大牛如何评价Web Essentials Web Essentials下载与安装 Web Essentials涉及到了哪些内容 初 ...

随机推荐

  1. thinkphp 区分大小写的文件存在判断

    /** * 区分大小写的文件存在判断 * @param string $filename 文件地址 * @return boolean */ function file_exists_case($fi ...

  2. C#将数据以XML格式写入Excel

    本文转载:http://www.cnblogs.com/eflylab/archive/2008/09/21/1295580.html c#将数据导入Excel另类方法 今天公司突然给个Excel模版 ...

  3. strstr和memcmp函数的实现

    #include <stdio.h> #include <stdlib.h> //malloc()函数 typedef unsigned int size_t; size_t ...

  4. [React] Intro to inline styles in React components

    React lets you use "inline styles" to style your components; inline styles in React are ju ...

  5. 理解ArcGIS Javascript Viewer Widget及编程模型

    一个ArcGIS Javascript Viewer for JavaScript Widget是一组可以共享.迁移及部署到JavaScript View程序中的的文本文件.通常,一个程序员如果要开发 ...

  6. 再回首,Java温故知新(一):Java概述

    Java发展历程 Java的发展要追溯到1991年,Patrick Naughton(帕特里克·诺顿)和James Gosling(詹姆斯·高斯林)带领Sun公司的工程师打算为有线电视转换盒之类的消费 ...

  7. Some code changes cannot be hot swapped into a running virtual machine,

    翻译一下:不能热交换到运行虚拟机,一些代码变化不能热交换到运行虚拟机,如更改名称或介绍的方法错误运行代码.解决方法:增加.删除类文件或者在一个类中增加.删除方法时,是不能够热部署到服务上的.这时候需要 ...

  8. iOS的内存管理

    在Objective-C 这种面向对象的语言里,内存管理是个重要的概念.要想用一门语言写出内存使用效率高而且又没有bug的代码,就得掌握其内存管理模型的种种细节. 一旦理解了这些规则,你就会发现,其实 ...

  9. MAC 环境下 初始化新的mysql root 密码

    mac 环境下初始化mysql的root密码 关掉mysql服务,打开系统设置最后的mysql,然后将mysql先关掉 生成一个文件命名mysql-init,文件中放入:一句话,这句话不同版本不一样, ...

  10. 【python之路8】python基本数据类型(二)

    基本数据类型 4.列表(list) 创建列表 name_list = ['zhao','qian','sun','li'] 基本操作 索引 print(name_list[0]) #返回zhao pr ...