最简单的点击选项标题,切换网页内容代码   不指定

2010/10/05 评论(0) 阅读(10862) | |
1、在<head>与</head>之间(后台登录 -> 常规管理 -> 模块配置 -> head模块 -> 在此新增项目)插入以下代码:
<script type="text/javascript"> function showt1() { document.getElementById("t1").style.display = ""; document.getElementById("t2").style.display = "none"; document.getElementById("t3").style.display = "none"; } function showt2() { document.getElementById("t1").style.display = "none"; document.getElementById("t2").style.display = ""; document.getElementById("t3").style.display = "none"; } function showt3() { document.getElementById("t1").style.display = "none"; document.getElementById("t2").style.display = "none"; document.getElementById("t3").style.display = ""; } </script>

2、在<body>与</body>之间(后台登录 -> 常规管理 -> 模块配置 ->侧边模块 -> 在此新增项目)插入以下代码:
<table width="240" height="20" border="0" cellpadding="0" cellspacing="1" bgcolor="#33CCFF">   <tr>     <td align="center" valign="middle" bgcolor="#996699"><span onclick="javascript:showt1();">项目一</span></td>     <td align="center" valign="middle" bgcolor="#CC6600"><span onclick="javascript:showt2();">项目二</span></td>     <td align="center" valign="middle" bgcolor="#FFCCFF"><span onclick="javascript:showt3();">项目三</span></td>   </tr> </table> <table width="400" height="100" border="0" cellpadding="0" cellspacing="1" bgcolor="#00CCFF" id="t1" style="display: all">   <tr>     <td align="left" valign="top" bgcolor="#FFFFFF">这边是项目一的内容</td>   </tr> </table> <table width="400" height="100" border="0" cellpadding="0" cellspacing="1" bgcolor="#00CCFF" id="t2" style="display: none">   <tr>     <td align="left" valign="top" bgcolor="#FFFFFF">这边是项目二的内容</td>   </tr> </table> <table width="400" height="100" border="0" cellpadding="0" cellspacing="1" bgcolor="#00CCFF"  id="t3" style="display: none">   <tr>     <td align="left" valign="top" bgcolor="#FFFFFF">这边是项目三的内容</td>   </tr> </table>

演示:博客侧边栏 吕进微博
分享到: 微信 更多
Via 本站原创
作者:白燕湾 | 分类:免费资源 Tags: ,
发表评论

昵称

网址

电邮

打开HTML 打开UBB 打开表情 隐藏 记住我 [登入] [注册]