如何实现动易官方网站内容页的移动菜单效果？(5)_动易Cms教程
教程Tag：暂无Tag,欢迎添加,赚取U币!
〈/tr〉
〈/tbody〉
〈tbody id='Tabs2' style="display: none;"〉
〈tr〉
〈td style="border-top: 3px solid #E8641B;border-left: 1px solid #E8641B;border-right: 1px solid #E8641B;border-bottom: 1px solid #E8641B;WORD-BREAK: break-all; background: #ffffff;padding:2;"〉“测试按钮〈font color="#FF0000"〉2〈/font〉”中要显示的内容〈/td〉
〈/tr〉
〈/tbody〉
〈tbody id='Tabs2' style="display: none"〉
〈tr〉
〈td style="border-top: 3px solid #E8641B;border-left: 1px solid #E8641B;border-right: 1px solid #E8641B;border-bottom: 1px solid #E8641B;WORD-BREAK: break-all; background: #ffffff;padding:2;"〉“测试按钮〈font color="#FF0000"〉3〈/font〉”中要显示的内容〈/td〉
〈/tr〉
〈/tbody〉
〈tbody id='Tabs2' style="display: none"〉
〈tr〉
〈td style="border-top: 3px solid #E8641B;border-left: 1px solid #E8641B;border-right: 1px solid #E8641B;border-bottom: 1px solid #E8641B;WORD-BREAK: break-all; background: #ffffff;padding:2;"〉“测试按钮〈font color="#FF0000"〉4〈/font〉”中要显示的内容〈/td〉
〈/tr〉
〈/tbody〉
〈tbody id='Tabs2' style="display: none"〉
〈tr〉
〈td style="border-top: 3px solid #E8641B;border-left: 1px solid #E8641B;border-right: 1px solid #E8641B;border-bottom: 1px solid #E8641B;WORD-BREAK: break-all; background: #ffffff;padding:2;"〉“测试按钮〈font color="#FF0000"〉5〈/font〉”中要显示的内容〈/td〉
〈/tr〉
〈/tbody〉
〈/table〉
请注重，假如页面中有多个此种方式的菜单，每个JS中则要定义不同的对象，如：
| 以下是第二个ＪＳ代码定义，注重红色处的定义，要与前一个ＪＳ定义不同： 〈SCRIPT language=JavaScript〉 var t2ID=0; function ShowTabs2(ID){ if(ID!=t2ID){ Tab2Title[t2ID].className='menu_bottom3'; Tab2Title[ID].className='menu_bottom4'; Tabs2[t2ID].style.display='none'; Tabs2[ID].style.display=''; t2ID=ID; } } 〈/SCRIPT〉 |
第三个点击菜单效果
假如将按钮td表格定义中的“onmouseover”改成“onclick”，效果又会是如何了呢？点击下面的按钮试试：
。