我以前寫(xiě)個(gè)一個(gè)例子，希望對(duì)你有幫助，上下滑動(dòng)效果的，里面兩個(gè)方法，一個(gè)是展開(kāi)，一個(gè)收收起，put 為收起，Roll 為展開(kāi)，自己配對(duì)自己的div，就可以實(shí)現(xiàn)你要的效果了 function put var put_div = documentgetElementById#39comment#39 這個(gè)是得到第一個(gè)div var puth3 = document。

1折疊面板動(dòng)態(tài)生成，通過(guò)positionID的唯一標(biāo)識(shí)將不同的折疊數(shù)據(jù)進(jìn)行輸出，name值為positionID，方便控制折疊面板的展開(kāi)和折疊2折疊面板內(nèi)容的動(dòng)態(tài)生成全選按鈕，CheckBox組，相互不沖突通過(guò)positionIDXXX這種數(shù)據(jù)格式存放數(shù)據(jù)，XXX為CheckBox的數(shù)據(jù)3控制其中一個(gè)折疊面板有數(shù)據(jù)選中時(shí)，其他面板。

現(xiàn)在，根據(jù)以上實(shí)現(xiàn)原理分析，我們創(chuàng)建一個(gè)高度的改變動(dòng)畫(huà)通用組件CollapseTransitionvue該組件非常簡(jiǎn)單，僅需30多行代碼我?guī)缀趺啃写a都有注釋，大家應(yīng)該能看懂吧以上就是實(shí)現(xiàn)高度的改變動(dòng)畫(huà)的通用組件源碼，童鞋們理解了嗎是不是非常簡(jiǎn)單現(xiàn)在，我們實(shí)現(xiàn)折疊面板組件使用過(guò)elementui這樣的UI庫(kù)。

下面代碼就是你要的效果！具體樣式再根據(jù)你的需要進(jìn)行修改就可以lt！DOCTYPE HTML PUBLIC quotW3CDTD HTML 401 TransitionalENquot quotREChtml40124loosedtdquot ltHTML xmlns=quotltHEADltTITLE廣告代碼CSS+XHTML代碼lt。

用選擇器啊 你根據(jù)這個(gè)改一下 quotmain aquotclickfunction如果設(shè)為main a則在子菜單的點(diǎn)擊也有相同的效果 找到主菜單項(xiàng)所對(duì)應(yīng)的子菜單項(xiàng) var ulNode=$thisnextquotulquot*最初的方法 ifulNodecssquotdisplayquot==quotquot ulNodecssquotdisplayquot，quotblockquot把display。