TWiki > JQueryPlugin	Daya Bay webs: Public | 中文 | Internal | Help
			Log In or Register

JQuery Plugin

Description

This plugin packages the popular jQuery and jQuery UI JavaScript libraries.

• jQuery  is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.
  • Packaged version: jquery-1.10.2

• jQuery UI  is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library.
  • Packaged version: jquery-ui-1.10.3

See the JQueryPluginExamples page for a demo of a couple of widgets used by TWiki.

Included libraries

1. jquery - base jQuery library , loaded when JQueryPlugin is enabled
2. jquery-ui - jQuery UI library , load with %JQSCRIPT{"jquery-ui.js"}% or a %JQTHEME{"..."}% - content:
   • UI Core:
     • Core - the core of jQuery UI, required for all interactions and widgets
     • Widget - the widget factory, base for all widgets
     • Mouse - the mouse widget, a base class for all interactions and widgets with heavy mouse interaction
     • Position - a utility plugin for positioning elements relative to other elements
   • Interactions - adding basic behaviors to any element and are used by many components below
     • Draggable - makes any element on the page draggable
     • Droppable - generated drop targets for draggable elements
     • Resizable - makes any element on the page resizable
     • Selectable - makes a list of elements mouse selectable by dragging a box or clicking on them
     • Sortable - makes a list of items sortable
   • Widgets - full-featured UI Controls - each has a range of options and is fully themeable:
     • Accordion - creates an accordion navigation widget
     • Autocomplete - creates an autocomplete widget
     • Button - creates an button widget
     • Dialog - opens existing markup in a draggable and resizable dialog
     • Slider - a flexible slider with ranges and accessibility via keyboard
     • Tabs - transforms a set of container elements into a tab structure
     • Datepicker - a datepicker than can be toggled from a input or displayed inline
     • Progressbar - a status indicator that can be used for a loading state and standard percentage indicators
   • Effects - a rich effect API and ready to use effects:
     • Effects Core - extends the internal jQuery effects, includes morphing, easing and is required by all other effects
     • Effect "Blind" - blinds the element
     • Effect "Bounce" - bounces an element horizontally or vertically n-times
     • Effect "Clip" - clips the element on and off like an old TV
     • Effect "Drop" - a Drop out effect by moving the element in one direction and hiding it at the same time
     • Effect "Explode" - the element explodes in all directions into n pieces. Also supports imploding again
     • Effect "Fade" - fades the element
     • Effect "Fold" - folds the element first horizontally and then vertically
     • Effect "Highlight" - highlights the background of the element in a defined color for a custom duration
     • Effect "Pulsate" - the element pulsates n times by changing the opacity to zero and back
     • Effect "Scale" - grow or shrink any element and it's content and restore it again
     • Effect "Shake" - shakes the element horizontally or vertically n times
     • Effect "Slide" - the element slides in and out of the viewport
     • Effect "Transfer" - transfer effect from one element to another
3. jquery.bgiframe.js - fix z-index issue in IE 6, loaded when JQueryPlugin is enabled
4. jquery.blockUI.js - simulate synchronous behavior when using AJAX, without locking the browser, loaded when JQueryPlugin is enabled
5. jquery.cookie.js - cookie managers, load with %JQSCRIPT{"jquery.cookie.js"}%
6. jquery.debug.js - debug, load with %JQSCRIPT{"jquery.debug.js"}%
7. jquery.dom.js - loaded when JQueryPlugin is enabled
8. jquery.easing.js - set custom easing types for standard animations, loaded when JQueryPlugin is enabled
9. jquery.hoverIntent.js - delay onMouseOver, loaded when JQueryPlugin is enabled
10. jquery.innerfade.js - loaded when JQueryPlugin is enabled
11. jquery.metadata.js - extract metadata from classes, random attributes, child elements and HTML5 data-* attributes, load with %JQSCRIPT{"jquery.metadata.js"}%
12. jquery.nifty.js - rounded corners, loaded when JQueryPlugin is enabled
13. jquery.shrinkurls.js - shrink URLs, loaded when JQueryPlugin is enabled
14. jquery.spinner.js - spinners, load with %JQSCRIPT{"jquery.spinner.js"}%
15. jquery.superfish.css
16. jquery.superfish.js - pulldown menues, load with %JQSCRIPT{"jquery.superfish.js"}%
17. jquery.tabpane.js - tapped panes, loaded when JQueryPlugin is enabled
18. jquery.tooltip.js - tool tips, loaded when JQueryPlugin is enabled
19. jquery.treeview.async.js - expandable trees, loaded when JQueryPlugin is enabled
20. jquery.treeview.edit.js - expandable trees, load with %JQSCRIPT{"jquery.treeview.edit.js"}%
21. jquery.treeview.sortable.js - expandable trees, load with %JQSCRIPT{"jquery.treeview.sortable.js"}%
22. jquery.treeview.js - expandable trees, loaded when JQueryPlugin is enabled
23. jquery.twiki.js - TWiki specific code, loaded when JQueryPlugin is enabled

JQuery Library Documentation

• Getting the feet wet 
• Tutorials 
• Reference API 
• Using jQuery with other libraries 
• Plugin repository 

Syntax Rules

• %JQSCRIPT{"jquery.js"}% - include the specified script. Keep in mind that the jquery.js script must be loaded before plug-ins scripts.
• %JQTHEME{"mythemename"}% - include the specified theme. Better load the desired theme before any script.
• %JQIMAGESURLPATH{"myimage.png"}% - expand to the specified image path.
• %JQIMAGESURLPATH%/myimage.png - Same result as the above. Available images:
  • spinner_arrows.gif
  • spinner_big.png
  • spinner.gif
  • spinner.png

Themes

See jQuery Theme Roller  for look & feel of available themes. The JQueryPlugin ships with the following themes that can be activated using %JQTHEME{...}%:

• black-tie
• cupertino
• redmond
• smoothness - recommended for TWiki
• ui-lightness

Examples

• PluginTestJQueryPlugin
• JQueryPluginExamples

Known Issues

• jquery.treeview does not work in JQueryPlugin version 2013-08-23

Note to Plugin Maintainer

• See pub/TWiki/JQueryPlugin/readme.txt

Installation Instructions

This plugin is pre-installed. TWiki administrators can upgrade the plugin as needed on the TWiki server.

Show details Hide details

Plugin Info

Plugin Author:	TWiki:Main.MichaelDaum, TWiki:Main.PeterThoeny
Copyright:	© 2007-2008 Michael Daum http://michaeldaumconsulting.com © 2008-2014 TWiki:TWiki.TWikiContributor
License:	GPL (GNU General Public License )
Plugin Version:	2014-09-03

Show Change History Hide Change History

2014-09-03:	TWikibug:Item7548: The CSS margin definition of tab(JQTAB) headers need to take precedence.
2014-08-26:	TWikibug:Item7544: JQTAB enhancement: Active tabs have gray gradient; slightly bigger container padding and inter-tab margin
2014-08-17:	TWikibug:Item7544: JQTAB enhancements: Show blue link instead of red link on hover over tab; make css overridable; remove dotted underline below tab -- TWiki:Main.PeterThoeny
2013-09-28:	TWikibug:Item6737: Fix broken nested tabs -- TWiki:Main.PeterThoeny
2013-08-23:	TWikibug:Item7317: Update JQueryPlugin to jquery-1.10.2 and jquery-ui-1.10.3 -- TWiki:Main.PeterThoeny
2013-01-28:	TWikibug:Item7091: Use TWISTY in installation instructions and change history
2012-11-13:	TWikibug:Item7020: Categorize TWiki Variable -- TWiki:Main.PeterThoeny
2011-07-08:	TWikibug:Item6725: Plugins: Change global package variables from "use vars" to "our" -- TWiki:Main.PeterThoeny
2011-03-01:	TWikibug:Item6675: Possible to specify JQTHEME more than once per page, but only first one takes effect -- TWiki:Main.PeterThoeny
2011-03-01:	TWikibug:Item6653: Update plugin to jquery-1.5.1 and jquery-ui-1.8.10 -- TWiki:Main.PeterThoeny
2010-06-08:	TWikibug:Item6486 - upgrade to latest jquery-1.4.2 release -- TWiki:Main/SopanShewale; add variable documentation topics VarJQTABPANE, VarJQTAB, VarJQENDTAB, VarJQENDTABPANE -- TWiki:Main/PeterThoeny
2010-04-25:	TWikibug:Item6436 - renamed too generic variable names BUTTON, TOGGLE, CLEAR, TABPANE, ENDTABPANE, TAB, ENDTAB to JQBUTTON, JQTOGGLE, JQCLEAR, JQTABPANE, JQENDTABPANE, JQTAB, JQENDTAB, respectively. Old variables names available if configure setting is set: $TWiki::cfg{JQueryPlugin}{Legacy2008} = 1; -- TWiki:Main/PeterThoeny
2010-04-22:	TWikibug:Item6433 - doc improvements, no code changes
15 Jul 2008:	updated to ui-1.5.2; added async treeview; added async options to tabpane
03 Jul 2008:	updated to ui-1.5.1
05 Jun 2008:	updated to jquery-1.2.6 and ui-1.5-RC1
30 Apr 2008:	repackaged to contain jquery UI
13 Feb 2008:	upgrade to jquery-1.2.3, as well as most plugins
17 Jan 2008:	added jquery.metadata plugin; implemented a jquery.tabpane plugin; updated jquery.dimensions plugin; added jquery.empty plugin to ease development of new plugins
15 Nov 2007:	use skin independent way to add javascript files to header
10 Oct 2007:	upgraded to jQuery-1.1.4; compressed js and css
12 Jul 2007:	initial package containing jQuery-1.1.3.1

Dependencies:	None
Plugin Home:	http://twiki.org/cgi-bin/view/Plugins/JQueryPlugin
Feedback:	http://twiki.org/cgi-bin/view/Plugins/JQueryPluginDev
Appraisal:	http://twiki.org/cgi-bin/view/Plugins/JQueryPluginAppraisal

Related topics: VarJQTABPANE, VarJQTAB, VarJQENDTAB, VarJQENDTABPANE, PluginTestJQueryPlugin, JQueryPluginExamples, TWikiPlugins, DeveloperDocumentationCategory, AdminDocumentationCategory