目錄 discuz內(nèi)置了很多彈出效果,這里說(shuō)下showMenu()
用showMenu的時(shí)候比較簡(jiǎn)單
<a id="profile" onclick="showMenu({'ctrlid':'profile','pos':'43!','cache':'1'})" hidefocus="true">菜單</a>
<div id="profile_menu" style="display: none;margin-left: -45px;">菜單內(nèi)容</div>
|
這里需要記錄的:
1.onclick=showMenu點(diǎn)擊彈出移開(kāi)隱藏。
2.參數(shù):ctrlid,控制菜單的id,會(huì)控制以此id_menu命名的容器顯隱,可以加menuid參數(shù)以定義顯示菜單的id ,具體最后列出。
3.定位:需要特別注意的是,這個(gè)效果彈出的容器是以body左上角作為基點(diǎn),不能放在其他相對(duì)定位的元素里,否則錯(cuò)位。而且默認(rèn)有超出邊界會(huì)動(dòng)態(tài)調(diào)整效果(如:在按鈕的右下角彈出時(shí)若超出屏幕,則會(huì)自動(dòng)調(diào)整為左下角彈出以免看不到內(nèi)容),位置參數(shù)pos,在數(shù)字后面加了!是禁止調(diào)整。
4.因?yàn)樵趹?yīng)用的時(shí)候我的菜單是ajax load進(jìn)來(lái)的,所以加了個(gè)cache(緩存),貌似想錯(cuò)了沒(méi)效果還是每次彈出都重新load內(nèi)容。
5.彈出容器profile_menu設(shè)置默認(rèn)隱藏,且我的彈出容器較寬,希望相對(duì)按鈕在下方居中,所以添加了左移45px,這也是為什么設(shè)置pos禁止動(dòng)態(tài)調(diào)整彈出方向的原因。
6.發(fā)現(xiàn)個(gè)問(wèn)題,在<a>里使用font-awesome的<i class="fa fa-xxx"></i>點(diǎn)擊無(wú)效,class可加到<a>行里。