jQuery UI - SPLessons
SPLessons 5 Steps, 3 Clicks
5 Steps - 3 Clicks

jQuery UI Tutorial

jQuery UI Tutorial

shape Introduction

This chapter demonstrates about the jQuery UI Tutorial which is nothing but a set of plugins for jQuery and which adds some functionalities to the jQuery Library and following are the concepts covered in this chapter.
  • jQuery UI Introduction
  • jQuery Features

jQuery UI Introduction

shape Description

jQueryUI stands for jQuery interface. Which is a set of animated visual effects, graphical user interface widgets, and themes are implemented with jQuery, CSS, HTML, and JavaScript? These new plug-ins add plenty of recent functionalities within the jQuery core library. jQuery UI is used to increase the jQuery library by providing an expensive set of interactive widgets and ways to reinforce web pages and applications. It is a very common and powerful mobile initial front-end framework used for quicker and easier net development. according to a survey, it's used on over 176000 websites, creating it the second most well-liked JavaScript library on the web.

shape Examples

In jQuery user will get several examples according to the topic here is a simple example of jQuery i.e jQuery draggable as shown below. [html] <!DOCTYPE html> <head> <link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> <style> #draggable { width: 100px; height: 100px; padding: 0.5em; background:#ADFF2F;} </style> <script> $(function() { $( "#draggable" ).draggable(); }); </script> </head> <body> <div id="draggable" class="ui-widget-content"> <p>I am draggable!</p> </div> </body> </html> [/html]
Result By running the above code in a preferred browser user can get the following output as shown in below image. The user can Hold and drag the box is as shown in below image.

jQuery Features

shape Description

jQuery UI is employed to increase the jQuery library by providing an expensive set of interactive widgets and strategies to reinforce web pages and applications following are some features os jQuery as shown below.
Getting jQuery UI Getting jQuery UI is nothing, however, a group of plugins for jQuery, Which adds new capabilities and functionalities to the core jQuery Library. A user can get the jQuery Library from the official page of jQuery in which user can get the latest version of the jQuery which is shown in below image. The user can also create a custom download of jQuery UI Library and tack together them per project necessities.
History of jQuery jQuery is an open source software which is free and released in the year of 2007 September. Which is distributed by the jQuery foundation under MIT license? After that, there have been several versions released with additional functionalities.

Summary

shape Key Points

  • jQueryUI stands for jQuery interface.
  • jQuery UI is nothing, however, a group of plugins for jQuery.
  • jQuery have Powerful theme mechanism.

jQuery UI - Related Information
jQuery Ajax
jQuery Effects
jQuery Events
jQuery Examples