基于JQuery的一句話搞定手風(fēng)琴菜單
更新時間:2012年09月14日 02:26:55 作者:
基于JQuery的一句話搞定手風(fēng)琴菜單效果代碼,需要的朋友可以參考下
一、Html代碼
<div class="MenuSubTitle AccordionCollapse">子菜單1</div>
<div>
<a href="Fld_BaseData/aa.aspx">aa管理</a><br/>
<a href="Fld_BaseData/bb.aspx">bb管理</a><br/>
</div>
<div class="MenuSubTitle AccordionCollapse">子菜單2</div>
<div>
<a href="Fld_BaseData/aa.aspx">ccc管理</a><br/>
<a href="Fld_BaseData/bb.aspx">ddd管理</a><br/>
</div>
</div>
二、Jquery代碼
$(function () {
$('.MenuSubTitle').click(function () {
$(this).toggleClass('AccordionCollapse').toggleClass('AccordionExpand').next().toggle('normal');
});
});
三、效果圖

作者:欣靜賞悅
復(fù)制代碼 代碼如下:
<div class="MenuSubTitle AccordionCollapse">子菜單1</div>
<div>
<a href="Fld_BaseData/aa.aspx">aa管理</a><br/>
<a href="Fld_BaseData/bb.aspx">bb管理</a><br/>
</div>
<div class="MenuSubTitle AccordionCollapse">子菜單2</div>
<div>
<a href="Fld_BaseData/aa.aspx">ccc管理</a><br/>
<a href="Fld_BaseData/bb.aspx">ddd管理</a><br/>
</div>
</div>
二、Jquery代碼
復(fù)制代碼 代碼如下:
$(function () {
$('.MenuSubTitle').click(function () {
$(this).toggleClass('AccordionCollapse').toggleClass('AccordionExpand').next().toggle('normal');
});
});
三、效果圖

作者:欣靜賞悅
您可能感興趣的文章:
- jQuery Easyui使用(一)之可折疊面板的布局手風(fēng)琴菜單
- jQuery制作效果超棒的手風(fēng)琴折疊菜單
- 基于Jquery代碼實現(xiàn)手風(fēng)琴菜單
- jQuery多級手風(fēng)琴菜單實例講解
- 基于jQuery實現(xiàn)以手風(fēng)琴方式展開和折疊導(dǎo)航菜單
- jquery實現(xiàn)簡單手風(fēng)琴菜單效果實例
- jquery實現(xiàn)下拉菜單的手風(fēng)琴效果
- 基于jQuery實現(xiàn)手風(fēng)琴菜單、層級菜單、置頂菜單、無縫滾動效果
- Jquery 垂直多級手風(fēng)琴菜單附源碼下載
- jQuery插件實現(xiàn)手風(fēng)琴二級菜單
相關(guān)文章
基于Jquery+Ajax+Json的高效分頁實現(xiàn)代碼
分頁我相信大家存儲過程分頁已經(jīng)很熟悉了,ajax更是耳熟能詳了,更別說我們的json,等等2011-10-10jQuery動態(tài)移除與增加onclick屬性的方法詳解
這篇文章主要介紹了jQuery動態(tài)移除與增加onclick屬性的方法,結(jié)合實例形式分析了jQuery使用attr與removeAttr方法針對元素屬性動態(tài)操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2018-06-06jQuery常用知識點總結(jié)以及平時封裝常用函數(shù)
這篇文章主要介紹了jQuery常用知識點總結(jié)以及平時封裝常用函數(shù) 的相關(guān)資料,需要的朋友可以參考下2016-02-02jquery插件制作 自增長輸入框?qū)崿F(xiàn)代碼
本章我們將創(chuàng)建一個自增長的輸入框插件,jquery.aotogrow.js2012-08-08