各種效果的jquery ui 介面 介紹

基本的滑鼠互動：

拖拽(drag and dropping)、排序(sorting)、選擇(selecting)、縮放(resizing)

各種互動效果：

手風琴式的摺疊選單(accordions)、日曆(date pickers)、對話方塊(dialogs)、滑動條(sliders)、**排序(table sorters)、頁籤(tabs)、放大鏡效果(magnifier)、陰影效果(shadow)

第一部分：滑鼠互動

1.1 draggables:拖拽

所需檔案：

ui.mouse.js

ui.draggable.js

ui.draggable.ext.js

用法：檔案載入後，可以拖拽class = "block"的層

$(document).ready(function());

draggable(options)可以跟很多選項

選項說明：

選項例項：

選項例項：

1.3　sortables　排序

所需要的檔案

jquery.dimensions.js

ui.mouse.js

ui.draggable.js

ui.droppable.js

ui.sortable.js

用法：$(document).ready(function());

});dimensions文件

選項說明：

選項例項：

1.4 selectables 選擇

所需要的檔案

jquery.dimensions.js

ui.mouse.js

ui.draggable.js

ui.droppable.js

ui.selectable.js

用法：$(document).ready(function());

選項說明：

選項例項：

1.5　resizables改變大小

所需要的檔案　，此例子需要幾個css檔案

jquery.dimensions.js

ui.mouse.js

ui.resizable.js

用法：$(document).ready(function());

css檔案：

選項說明：

選項例項： ... s/ui.resizable.html

第二部分：互動效果

2.1 accordion 摺疊選單

所需要的檔案:

ui.accordion.js

jquery.dimensions.js

用法：$(document).ready(function());

css檔案：

選項說明：

選項例項：/plugins/accordion/?p=1.1.1

2.2 dialogs 對話方塊

所需要的檔案：

jquery.dimensions.js

ui.dialog.js

ui.resizable.js

ui.mouse.js

ui.draggable.js

用法：$(document).ready(function());

css檔案：

選項說明：

選項例項：/plugins/ui/tests/dialog.html

2.3 sliders 滑動條

所需要的檔案

jquery.dimensions.js

ui.mouse.js

ui.slider.js

用法：$(document).ready(function());

css檔案：

選項說明：

選項例項：/plugins/ui/demos/ui.slider.html

2.4 tablesorter**排序

所需要的檔案

ui.tablesorter.js

用法：$(document).ready(function());

});css檔案：

選項說明：

選項例項：

2.5 tabs頁籤(對ie支援不是很好)

所需要的檔案

ui.tabs.js

用法：$(document).ready(function());

css檔案：

選項說明：

選項例項：/plugins/ui/tests/tabs.html

tabs ext 

第三部分：效果

3.1 shadow 陰影

例項/plugins/ui/demos/ui.shadow.html

3.2 magnifier 放大

例項/plugins/ui/demos/ui.magnifier.html

各種效果的jquery ui 介面 簡介

基本的滑鼠互動 拖拽 drag and dropping 排序 sorting 選擇 selecting 縮放 resizing 各種互動效果 手風琴式的摺疊選單 accordions 日曆 date pickers 對話方塊 dialogs 滑動條 sliders 排序 table sorters...

各種效果的jquery ui 介面 介紹

基本的滑鼠 互動 拖拽 drag and dropping 排序 sorting 選擇 selecting 縮放 resizing 各種互動效果 手風琴式的摺疊選單 accordions 日曆 date pickers 對話方塊 dialogs 滑動條 sliders 排序 table sorter...

jQuery UI效果函式演示

最近在看jquery ui的庫，以前沒怎麼系統學過jquery ui庫函式的效果，js說到底是一門函式式程式語言，靠一點點的搭建來完成整個框架，現將效果函式的用法列表如下，具體的實現可以去看庫函式。addclass 當動畫樣式改變時，為匹配的元素集合內的每個元素新增指定的class。div clic...