jQuery-UI

jQuery UI adalah JavaScript library yang menyediakan abstraksi untuk interaksi tingkat rendah dan animasi , efek canggih dan tingkat tinggi, themeable widget , dibangun di atas jQuery JavaScript library, yang dapat digunakan untuk membangun aplikasi web interaktif. Album ini dirilis pada bulan September 2007, diumumkan dalam sebuah posting blog oleh John Resig pada jquery.com. [4] Rilis terbaru, 1.10.1, memerlukan jQuery 1.6 atau yang lebih baru. [5]
jQuery UI adalah perangkat lunak bebas, open source, berlisensi di bawah Lisensi MIT .

Widget

Semua widget jQuery UI sepenuhnya themeable menggunakan konsolidasi, mekanisme tema terkoordinasi. ^[7]

• Kontainer Accordion - Accordion
• Autocomplete - kotak Auto-lengkap berdasarkan apa jenis pengguna
• Button - Peningkatan tombol penampilan, putar tombol radio dan checkbox ke pushbuttons
• Datepicker - Advanced tanggal-pemetik
• Dialog - Tampilkan kotak dialog di atas konten lainnya, mudah dan kokoh
• Menu - menu Tampilkan a
• Progressbar - Progress bar, baik animasi dan tidak
• Slider - slider Sepenuhnya disesuaikan dengan berbagai fitur: 
• Spinner - Tampilkan Nomor Spinner
• Tabs - Tabbed penanganan antarmuka pengguna, dengan kedua inline dan konten demand-loaded
• Tooltip - Tampilkan Tooltip 

Effects

• Animasi Berwarna - Menghidupkan transisi dari satu warna ke warna lain
• Beralih Class, Add Class, Hapus Class, Beralih Class - Menghidupkan transisi dari satu set gaya yang lain
• Efek - Berbagai efek (muncul, geser-down, meledak, fade-in, dll)
• Beralih - Beralih efek dan mematikan
• Hide, Show - Menggunakan efek di atas

Contoh

<Script type = "text / javascript">
  / / Membuat # draggable draggable
  $ (Function () {
   . $ ("# Draggable") draggable ();
  });
 </ Script>

 <Div id = "draggable" class = "ui-widget-content">
   <P> Tarik saya sekitar </ p>
 </ Div>
 ~ ~ ~ ~

Hal ini membuat div dengan ID "draggable" draggable oleh mouse pengguna.

 <Script type = "text / javascript">
  / / Mengubah css dari elemen
  $ (Function () {
   $ ("# Demo") css ('color', '# 069').;
  });
 </ Script>

 <Div id = "demo">
   Beberapa teks
 </ Div>