jQuery UI is a collection of GUI widgets , animated visual effects, and themes implemented with jQuery (a JavaScript library ), Cascading Style Sheets , and HTML . [4] According to JavaScript analytics service, Libscore , jQuery UI is used on over 197,000 of the top one million websites, making it the second most popular JavaScript library. [5] Notable users include Pinterest , PayPal , IMDb , The Huffington Post , and Netflix . [6]

Both jQuery and jQuery UI are free and open-source software distributed by the jQuery Foundation under the MIT License ; jQuery UI was first published in September 2007. [3] [7]

Features

As of the 1.11.4 release: [8]

Interactions

Draggable, Droppable, Resizable, Selectable, Sortable

Widgets

All of jQuery UI’s widgets are fully themeable using a consolidated, coordinated theme mechanism. [9]

  • Accordion – Accordion containers
  • Autocomplete – Auto-complete boxes
  • Button – Enhanced button appearance, turn on radio buttons and checkboxes into pushbuttons
  • Datepicker – Advanced date-picker
  • Dialog – Show dialog boxes on top of other content, easily and robustly
  • Menu – Show a Menu
  • Progressbar – Progress bars, both animated and not
  • Selectmenu – Duplicates and extends the functionality of a native HTML
  • Slider – Fully customizable sliders
  • Spinner – Show a Number Spinner
  • Tabs – Tabbed user interface handling, with both inline and demand-loaded content
  • Tooltip – Show a Tooltip

Effects

  • Color Animation – Animate the transition from one color to another
  • Toggle Class , Add Class , Remove Class , Switch Class – Animate the transition from one set of styles to Reviews another
  • Effect – A variety of effects (appear, slide-down, explode, fade-in, etc.)
  • Toggle – Toggle an effect on and off
  • Hide , Show – Using the effects above

Utilities

  • Position – Set an element in relation to another element’s position
  • Widget Factory – Create stateful jQuery plugins using the same abstraction as all jQuery UI widgets

Example

// make the element with id "draggable"
$ draggable ( function () {
$ ( "#draggable" ). Draggable ();
});
< div id = "draggable" >
< p > Drag me around </ p >
</ div >

This makes the word “draggable” draggable by the user’s mouse.

Release history

jQuery UI was launched on September 17, 2007. [7]

Release date[10] Version number jQueryDependency Additional notes
Sep 17, 2007 1.2.1+ Initial release [7]
Jun 8, 2008 1.5
Apr 16, 2009 1.6 1.2.6+ Compatibility release for jQuery 1.2.6.
Mar 3, 2009 1.7 1.3.2+
Mar 18, 2010 1.8 1.3.2+
Jan 19, 2011 1.8.9 1.3.2+
Feb 22, 2011 1.8.10 1.3.2+
Mar 15, 2011 1.8.11 1.3.2+
Apr 13, 2011 1.8.12 1.3.2+
May 12, 2011 1.8.13 1.3.2+
Jun 17, 2011 1.8.14 1.3.2+
Aug 1, 2011 1.8.15 1.3.2+
Aug 15, 2011 1.8.16 1.3.2+
Jan 10, 2012 1.8.17 1.3.2+
Feb 20, 2012 1.8.18 1.3.2+
Apr 16, 2012 1.8.19 1.3.2+
Apr 30, 2012 1.8.20 1.3.2+
Jun 5, 2012 08/01/21 1.3.2+
Jul 24, 2012 08/01/22 1.3.2+
Aug 15, 2012 1.8.23 1.3.2+
Sep 28, 2012 1.8.24 1.3.2+
Oct 8, 2012 1.9.0 1.6+
Oct 25, 2012 1.9.1 1.6+
Nov 23, 2012 1.9.2 1.6+
Jan 17, 2013 1.10.0 1.6+ Dropped support for IE6 [11]
Feb 15, 2013 1.10.1 1.6+
Mar 14, 2013 1.10.2 1.6+
May 3, 2013 1.10.3 1.6+
Jan 17, 2014 1.10.4 1.6+
Apr 25, 2014 1.11.0-beta.1 1.6+ Dropped support for IE7 [12]
May 23, 2014 1.11.0-beta.2 1.6+
Jun 26, 2014 1.11.0 1.6+
Aug 13, 2014 1.11.1 1.6+
Oct 16, 2014 1.11.2 1.6+
Feb 12, 2015 1.11.3 1.6+
Mar 11, 2015 1.11.4 1.6+
Jan 26, 2016 1.12.0-beta.1 1.7+ Dropped support for IE8, IE9, IE10 [13]
Mar 17, 2016 1.12.0-RC.1 1.7+
Apr 21, 2016 1.12.0-RC.2 1.7+
Jul 8, 2016 1.12.0 (unannounced) 1.7+
Sep 14, 2016 1.12.1 1.7+

References

  1. Jump up^ “jQuery UI Team” . jqueryui.com . The jQuery Foundation . Retrieved 5 February 2016 .
  2. Jump up^ “jQuery UI 1.12.1” . jqueryui.com . September 14, 2016.
  3. ^ Jump up to:b “License” . jQuery.com . The jQuery Foundation . Retrieved 12 June2014 .
  4. Jump up^ Sarrion, Eric (2012). jQuery UI . Sebastopol: O’Reilly Media. pp. 1-4. ISBN  9781449316990 . OCLC  768796881 .
  5. Jump up^ http://libscore.com/#libs
  6. Jump up^ http://libscore.com/#$.ui
  7. ^ Jump up to:c John Resig (17 September 2007). “jQuery UI: Interactions and plug-ins” . jQuery blog . Retrieved 12 August 2012 .
  8. Jump up^ “jQuery UI Demos” . jQuery UI . Retrieved 5 February 2016 .
  9. Jump up^ “jQuery UI: ThemeRoller” . jQuery UI . Retrieved 5 February 2016 .
  10. Jump up^ “jQuery UI – Documentation: UIChangelog” . Retrieved April 2, 2012 .
  11. Jump up^ jQuery UI 1.10.0, retrieved on Feb 15, 2013
  12. Jump up^ jQuery UI 1.11.0-beta.1, retrieved on May 1, 2014
  13. Jump up^ jQuery UI 1.12.0-beta.1, retrieved on Feb 5, 2016