jQuery UI Bootstrap是什么?

更新時間：2016年06月17日 16:37:33 作者：小峰

jQuery UI Bootstrap是什么?jQuery UI Bootstrap是一個將jQuery UI集成到Bootstrap上的CSS框架,具體內(nèi)容請看下文

jQuery UI Bootstrap是一個將jQuery UI集成到Bootstrap上的CSS框架，jQuery UI Bootstrap不僅可以利用jQuery UI強大的控件庫，同時還可以享受Bootstrap那種清新自然的主題風格，所以越來越多的前端開發(fā)者都在使用jQuery UI Bootstrap。
jQuery UI Bootstrap的特點
----- 基于jQuery UI，因此控件功能非常強大，可以使用全部的jQuery UI控件。
----- 基于Bootstrap，不同控件有了統(tǒng)一的外觀。
----- 免費開源，你可以很方便地下載和使用。

jQuery UI Bootstrap常用控件的使用
下面我們來介紹幾個最常用的jQuery UI Bootstrap控件，使用方法都非常簡單。

jQuery UI Bootstrap 按鈕

// Button
$('button').button();
// Anchors, Submit
$('.button').button();

jQuery UI Bootstrap 對話框

// Dialog Link
$('#dialog_link').click(function () {
 $('#dialog_simple').dialog('open');
 return false;
});

// Modal Link
$('#modal_link').click(function () {
 $('#dialog-message').dialog('open');
 return false;
});

// Dialog Simple
$('#dialog_simple').dialog({
 autoOpen: false,
 width: 600,
 buttons: {
  "Ok": function () {
   $(this).dialog("close");
  },
  "Cancel": function () {
   $(this).dialog("close");
  }
 }
});

// Dialog message
$("#dialog-message").dialog({
 autoOpen: false,
 modal: true,
 buttons: {
  Ok: function () {
   $(this).dialog("close");
  }
 }
});

jQuery UI Bootstrap 日期選擇器

// Datepicker
$('#datepicker').datepicker({
 inline: true
});

jQuery UI Bootstrap 菜單

//####### Menu
$("#menu").menu();

jQuery UI Bootstrap還有很多控件，這里就不一一列舉了，大家可以前往其官方網(wǎng)站下載使用。

本文鏈接：http://www.codeceo.com/article/jquery-ui-bootstrap.html
本文作者：碼農(nóng)網(wǎng) – 小峰

以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。

如果大家還想深入學習，可以點擊這里進行學習，再為大家附一個精彩的專題：Bootstrap學習教程

您可能感興趣的文章:

相關(guān)文章

jquery.gridrotator實現(xiàn)響應(yīng)式圖片展示畫廊效果
本教程將教大家制作一個jQuery響應(yīng)式圖片展示畫廊效果，所有圖片以網(wǎng)格的形式排列，然后定時隨機翻轉(zhuǎn)其中某些格子用來切換圖片。這種效果可以用來當做背景或裝飾放在我們的網(wǎng)站上。
2015-06-06
分享一些常用的jQuery動畫事件和動畫函數(shù)
在jquery中，jquery動畫事件和動畫函數(shù)經(jīng)常用的到，今天小編抽時間給大家整理了些關(guān)于常用的jquery動畫事件和動畫函數(shù)，對jquery動畫函數(shù)和動畫事件相關(guān)知識感興趣的朋友一起學習吧
2015-11-11
struts2 jquery 打造無限層次的樹
需要:Struts2 , jquery樹插件模擬數(shù)據(jù)庫數(shù)據(jù):每行數(shù)據(jù)包括--自己ID,自己內(nèi)容,父親ID
2009-10-10
jQuery實現(xiàn)左右兩個列表框的內(nèi)容相互移動功能示例
這篇文章主要介紹了jQuery實現(xiàn)左右兩個列表框的內(nèi)容相互移動功能,涉及jQuery事件響應(yīng)及頁面元素屬性動態(tài)操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下
2019-01-01
jQuery實現(xiàn)動態(tài)加載瀑布流
這篇文章主要為大家詳細介紹了jQuery實現(xiàn)動態(tài)加載瀑布流，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2020-09-09
jQuery實現(xiàn)仿新浪微博浮動的消息提示框(可智能定位)
這篇文章主要介紹了jQuery實現(xiàn)仿新浪微博浮動的消息提示框,具有智能定位功能,涉及jQuery控制頁面元素浮動效果的實現(xiàn)技巧,需要的朋友可以參考下
2015-10-10
jquery ztree實現(xiàn)模糊搜索功能
這篇文章主要為大家詳細介紹了jquery ztree實現(xiàn)模糊搜索功能，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2016-02-02
php結(jié)合imgareaselect實現(xiàn)圖片裁剪
這篇文章主要介紹了php結(jié)合imgareaselect實現(xiàn)圖片裁剪的相關(guān)資料,需要的朋友可以參考下
2015-07-07
jQuery中ajax請求后臺返回json數(shù)據(jù)并渲染HTML的方法
今天小編就為大家分享一篇jQuery中ajax請求后臺返回json數(shù)據(jù)并渲染HTML的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-08-08
jquery uploadify如何取消已上傳成功文件
這篇文章主要為大家詳細介紹了jquery uploadify如何取消已上傳成功文件，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2017-02-02