ps:
1.需要使用者有點jquery核心外掛程式的基礎
2.所有講解都不包含css樣式,只說動態效果,樣式根據自己實際情況修改
一.匯入jquery核心外掛程式
二.匯入與accordion選單相關的ui外掛程式(ui.core.js,ui.accordion.js),
或直接匯入jquery-ui-1.7.2.custom.min.js(不建議,會導致頁面載入時多出沒必要的外掛程式載入)
三.用html標籤定義accordion選單(分靜態和動態):
1.靜態選單:
首先是最外層div,相當於是放accordion選單的容器,
然後是裡面的每個accordion選單項,其中每個項分為標題項和內容項,
title(這裡放標題)
content(這裡放內容)
這樣就做成了只有乙個選單項的accordion選單,若有多個選單,重複即可,如:
title(這裡放標題)
內容1內容2
title(這裡放標題)
內容1內容2
2.動態生成選單
同樣首先定義最外層div,相當於是放accordion選單的容器,
然後通過非同步獲取資料,並返回結果,達到動態生成效果,具體步驟如下:
①在script標籤中定義非同步呼叫的方法:
②新建乙個頁面,用來生成accordion選單的所有內容,這裡以asp頁面為例子:
在後台**的load事件中新增如下類似**:
protected void page_load(object sender, eventargs e)
}//每遍歷出乙個父選單及其下所有子選單,就追加到lt.text上,形成乙個字串格式的內容
lt.text += "" + head + "
" + content + "";}
}//最後將拼接好的字串返回,這裡的返回的lt.text就是上面getaccordionasync方法中成功後得到的資料result
response.write(lt.text);
四.生成accordion選單後,在頁面首次載入時呼叫accordion方法,使之能夠滑動
有以下幾種動態樣式:
1.$("#accordion").accordion();預設樣式
2.$("#accordion").accordion();
選單項是否使用相同高度,false為自動適應內容高度,true為所有選單高度相同,一般使用false
3.$("#accordion").accordion();
滑鼠移上時觸發滑動效果
以上三個位常用的效果,其他還有一些可以參考demo裡的方法
菜鳥部落格第一彈
隨著乙個多月的大學生活結束,今天終於開始了畢業的第一天工作。請了40多天的假,本來以為工作會悲劇的。但到公司同事和領導的關心使我擔心的小心感到了溫暖。早就想實現這個計畫,想在正式工作的時候寫部落格,也就是想記錄下每天的工作和每天的心情。寫博主要是記下這剛開始艱苦的歲月,不求對別人幫助,本人是菜鳥,歡...
oracle學習第一彈
每當我們建立資料庫例項的時候,就會自動的建立三個使用者 sys使用者 超級管理員,許可權最大 system使用者 系統管理員 scott使用者 普通使用者 有三種方式登入oracle資料庫 1.命令列sqlplus 2.sql developer 3.企業管理器,通過web訪問 sql plus是o...
日常翻譯 第一彈
第一題鏈結 題意 夏洛克和華生正在玩乙個遊戲 nim 這個遊戲有n堆石子被標註成piles1,piles2,pilesn n是石子最大堆數 夏洛克總是第乙個,華生跟他交替進行操作 在每一次操作中都有且只有兩種可能的情況 1.選擇一堆並且從中拿走k個石子,k 0 2.從每一堆石子中都拿走k個石子,k ...