怎样用js来实现下面类似菜单的效果?求代码,谢谢!!

jackydrl 2007-05-18 02:06:24
具体效果就是CSDN登录页面登录框左边的那个

要求就是点击一个菜单时,这个菜单下面的线没有了,从而和内容混为一体,

最重要的是,单击哪个菜单,其对应的内容显示出来.

在线等!谢谢!!
...全文
274 2 打赏 收藏 转发到动态 举报
写回复
用AI写文章
2 条回复
切换为时间正序
请发表友善的回复…
发表回复
lukan 2007-08-09
  • 打赏
  • 举报
回复
服了你了,你说的是tab页的实现吧

简而言之,就是给<li>标签一个onclick事件,然后切换它的样式

<ul class="game">
<li id="game1" class="selected2"><a onclick="toggle(1,7,'game','gamelist','selected2');" href="javascript:void(0);" target="_self">热门游戏</a></li>
<li id="game2"><a onclick="toggle(2,7,'game','gamelist','selected2');" href="javascript:void(0);" target="_self">ABCD</a></li>
</ul>


/**
* 处理标签页控件
*
* id:当前突出的标签页的序数
* count:总共的标签页个数
* tabName:标签页名称
* contentName:标签内容容器的名称
* className:突出显示的标签页的效果
*/
function toggle(id,count,tabName,contentName,className) {
for (var i = 1; i <= count; i++ ) {
document.getElementById(contentName+i).style.display='none';
document.getElementById(tabName+i).className='';
}

document.getElementById(contentName+id).style.display='block';
document.getElementById(tabName+id).className=className;
}
pol000 2007-08-09
  • 打赏
  • 举报
回复
up

87,921

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧