左右两张图片
点几左边一个就就左边一个亮右边一个暗
点右边就右边一个亮，左边一个暗
现在这4张图片已经有了
然后因该怎么实现这个效果呢

你是想做网易的那种吧
来这个帖子看看 http://bbs.bc-cn.net/viewthread.php?tid=144295

另外在看一下这个 对你有用没 我就是参考高手们的 指点做的 有点乱 呵呵 原谅 本人是刚学的 还有就是可以用 display:none display:block 结合鼠标事件来解决
[CODE]

<style>
#menu{margin:3 auto;width:760}
div.card div{background-color:#fff;float:left;padding:0px; clear:both; width:760px;}
div.card a{font-size:13px;text-decoration:none;float:left;width:100px;text-align:center;background-color:fff);margin-right:0px;height:20;padding:5;background:url("img/menu1.gif");}
div.card div.f a.f{font:normal 13px 宋体;color:#fff;background:url("img/menu2.gif");}
div.card div.a a.a{font:normal 13px 宋体;color:#fff;background:url("img/menu2.gif");}
div.card div.b a.b{font:normal 13px 宋体;color:#fff;background:url("img/menu2.gif");}
div.card div.c a.c{font:normal 13px 宋体;color:#fff;background:url("img/menu2.gif");}
div.card div.d a.d{font:normal 13px 宋体;color:#fff;background:url("img/menu2.gif");}
div.card div.e a.e{font:normal 13px 宋体;color:#fff;background:url("img/menu2.gif");}
div.card div.g a.g{font:normal 13px 宋体;color:#fff;background:url("img/menu2.gif");}
div.card div.content{background:#5DB30A;height:25px;padding:0 0 0 145;}
#a1{margin:0 auto;width:80;height:24;padding:5 0 0 0;background:#5DB30A}
#a2{margin:0 0;width:500;height:24;padding:0 0;float:right;background:#5DB30A}
#a3{margin:0 auto;}
#a2 a:link,#a2 a:visited{font-size:12px;text-decoration:none;color:#fff;}
#a2 a:hover{text-decoration:underline;}
#a3 a:link,#a3 a:visited{font-size:12px;text-decoration:none;color:#fff;}
#a3 a:hover{text-decoration:underline;}
#a4{margin:0 auto;width:50;height:24;padding:5 0 0 0;background:#5DB30A}
</style>

<script language="javascript">
var shq={};
shq.cmenu=function(e)
{
var e=window.event?window.event.srcElement:e.target;
if(/a/i.test(e.tagName)){
e.parentNode.className=e.className;
e.parentNode.nextSibling.innerHTML=fill(e.className);
e.parentNode.nextSibling.style.cssText='border-top:none';
e.blur();
}
}
function fill(id){
switch(id){
case "f" : return "<span id='a3'><a id='a1' href='#'>热点新闻</a> <a id='a1' href='#'>行业动态</a> <a id='a1' href='#'>企业动态</a> <a id='a1' href='#'>综合报道</a></span>";break;

case "b" : return "<span id='a3'><a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a></span>";break;

case "c" : return "<span id='a3'><a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a></span>";break;

case "d" : return "<span id='a3'><a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a</span>";break;

case "a" : return "";break;

case "g" : return "<span id='a2'><a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a4' href='#'>投资</a> <a id='a4' href='#'>创业</a> <a id='a4' href='#'>管理</a> <a id='a4' href='#'>营销</a></span>";break;

case "e" : return "<span id='a2'><a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a> <a id='a1' href='#'>导航条一</a></span>";break;
}
}
</script>

<div id="menu"><!--导航条-->
<div class="card">
<div onclick="shq.cmenu()" class="a">
<a href="index.htm" class="a">首 页</a>
<a href="#" class="f">新闻中心</a>
<a href="#" class="b">投资创业</a>
<a href="#" class="c">企业服务</a>
<a href="#" class="d">求职招聘</a>
<a href="#" class="e">社区生活</a>
<a href="#" class="g">论坛互动</a>
</div>
<div class="content"><script language="javascript">document.write(fill("a"));</script></div>
</div>
</div><!--导航条结束-->

[/CODE]

上面的图片没有发
你自己把代码复制过去 然后 把图片放到IMG路径下

我想学javascript 大家帮我推荐本入门书吧

[此贴子已经被作者于2007-6-15 12:55:40编辑过]

http://bbs.bc-cn.net/viewthread.php?tid=2814

好的 谢谢

不错哦。。