jQuery UI

From Wikipedia, the free encyclopedia
Jump to: navigation, search
jQuery UI
JQuery UI Logo.svg
Developer(s) The jQuery Project
Stable release 1.10.4 / January 17, 2014 (2014-01-17)[1]
Preview release 1.10 Beta / December 13, 2012 (2012-12-13)[2]
Development status Active
Written in JavaScript
Type Web application framework Plugin
License MIT[3]
Website http://jqueryui.com/

jQuery UI is a JavaScript library that provides abstractions for low-level interaction and animation, advanced effects and high-level, themeable widgets, built on top of the jQuery JavaScript library, that can be used to build interactive web applications. It was released in September 2007, announced in a blog post by John Resig on jquery.com.[4] The latest release, 1.10.4, requires jQuery 1.6 or later.[5]

jQuery UI is free, open source software, licensed under the MIT License.

Features[edit]

As of the 1.9.0 and 2.0.3 release:[6]

Interactions[edit]

Widgets[edit]

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

  • Accordion – Accordion containers
  • Autocomplete – Auto-complete boxes based on what the user types
  • Button – Enhanced button appearance, turn 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
  • Slider – Fully customizable sliders with various features:[8]
  • Spinner – Show a Number Spinner
  • Tabs – Tabbed user interface handling, with both inline and demand-loaded content
  • Tooltip – Show a Tooltip

Effects[edit]

  • 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 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[edit]

  • Position – Set an element's position relative to another element's position (alignment)

Example[edit]

<script type="text/javascript">
	// Make #draggable draggable
	$(function () {
		$("#draggable").draggable();
	});
</script>
<div id="draggable" class="ui-widget-content">
  <p>Drag me around</p>
</div>
~~~~

This makes the div with the ID "draggable" draggable by the user's mouse.


<script type="text/javascript">
	// change css of an element
	$(function () {
		$("#demo").css('color','#069');
	});
</script>
<div id="demo">
  Some text
</div>

This changes the css of div with the ID "demo".

Release history[edit]

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

Release date[9] Version number jQuery Dependency Additional notes
Initial release[4]
June 8, 2008 1.5
April 16, 2009 1.6 1.2.6 Compatibility release for jQuery 1.2.6.
March 3, 2009 1.7 1.3.2+
March 18, 2010 1.8 1.3.2+
January 19, 2011 1.8.9 1.3.2+
February 22, 2011 1.8.10 1.3.2+
March 15, 2011 1.8.11 1.3.2+
April 13, 2011 1.8.12 1.3.2+
May 12, 2011 1.8.13 1.3.2+
June 17, 2011 1.8.14 1.3.2+
August 1, 2011 1.8.15 1.3.2+
August 15, 2011 1.8.16 1.3.2+
January 10, 2012 1.8.17 1.3.2+
February 20, 2012 1.8.18 1.3.2+
April 16, 2012 1.8.19 1.3.2+
April 30, 2012 1.8.20 1.3.2+
June 5, 2012 1.8.21 1.3.2+
July 24, 2012 1.8.22 1.3.2+
August 15, 2012 1.8.23 1.3.2+
September 28, 2012 1.8.24 1.3.2+
October 8, 2012 1.9.0 1.6+
October 25, 2012 1.9.1 1.6+
November 23, 2012 1.9.2 1.6+
January 17, 2013 1.10.0 1.6+ Dropped support for IE6[10]
February 15, 2013 1.10.1 1.6+
March 14, 2013 1.10.2 1.6+
May 3, 2013 1.10.3 1.6+

References[edit]

  1. ^ González, Scott (2013-01-17). "jQuery UI 1.10.4". 
  2. ^ Zaefferer, Jörn (2012-12-13). "jQuery UI 1.10.4". 
  3. ^ "License - jQuery Project". jQuery Foundation. Retrieved 5 January 2013. 
  4. ^ a b c John Resig (17 September 2007). "jQuery UI: Interractions and plug-ins". jQuery blog. Retrieved 12 August 2012. 
  5. ^ "Build Your Download". Retrieved 2012-12-10. 
  6. ^ "jQuery UI Demos". jQuery UI. Retrieved 12 August 2012. 
  7. ^ "jQuery UI: ThemeRoller". jQuery UI. Retrieved 12 August 2012. 
  8. ^ "Jquery UI Examples – Creating a Page Content Slider". Innovative PHP. 21 July 2011. Retrieved 12 August 2012. 
  9. ^ "jQuery UI - Documentation: UIChangelog". Retrieved April 2, 2012. 
  10. ^ jQuery UI 1.10.0, retrieved on Feb 15, 2013

Further reading[edit]

External links[edit]