400分，求改一个JS导航

Question

http://topic.csdn.net/u/20100907/09/6a10c580-7d9b-4adf-b722-b9bae642fb8a.html原帖地址， 如能解决， 本人发的4贴分都给你。
——————————————————————————————http://www.szkehu.com/dropdown.htmlJS和css代码都在这个网页里面.现在要改的效果就是 鼠标放上去,出来一排下拉菜单, 然后鼠标移到每一个下拉菜单的时候,再右边出来一个子菜单,显示一张图片...网页上我做了效果说明.   泪谢！！

Answer 1

网上搜索 javascript 应该会有你要的效果

Answer 2

http://www.stunicholls.com/menu/pro_dropdown_2.html给你个网址，有你要的效果。。你把二级下拉菜单的链接改成你的图片之类的。。具体看你如何改了，希望对你有帮助。

Answer 3

那网站下面有个download，可以下载源码进行查看更改。。

Answer 4

去这个网站 有很多js导航
http://www.open-lib.com/Type/201-1.jsp

Answer 5

1：我大致看了你下，你做的，其实也基本完成了，至于图片的显示可以设置一个浮动的div来显示，点击不同的子菜单切换图片的路径就可以了
2：不建议看改别人的代码，看是可以的，因为那是别人的思想，你可以用他的知识，但绝不可以走他的痕迹，需要自己来创造
3：至于显示的位置我感觉你应该会吧，首先浮动的div，其次用margin-top margin-left就可以了

Answer 6

<style type="text/css">
.c{
display: none;
position: relative;
width:30px;
}
</style>
<span style="position:relative;" onmouseover="showC(this);" onmouseout="hideC(this);">文字
<div class="c" onmouseover="showP(this);">aaa<div style="background:blue;width:100px;height:20px;display:none;position:absolute;top:5px;left:30px;">pic</div></div>
<div class="c" onmouseover="showP(this);">bbb<div style="background:blue;width:100px;height:20px;display:none;position:absolute;top:5px;left:30px;">pic</div></div>
<div class="c" onmouseover="showP(this);">ccc<div style="background:blue;width:100px;height:20px;display:none;position:absolute;top:5px;left:30px;">pic</div></div>
<div class="c" onmouseover="showP(this);">ddd<div style="background:blue;width:100px;height:20px;display:none;position:absolute;top:5px;left:30px;">pic</div></div>
<div class="c" onmouseover="showP(this);">eee<div style="background:blue;width:100px;height:20px;display:none;position:absolute;top:5px;left:30px;">pic</div></div>
</span>
<script type="text/javascript">
var oldP;
function showC(o){
var cs = o.getElementsByTagName("div");
for(var i=0,l=cs.length;i<l;i++){
if(cs[i].className == "c"){
cs[i].style.display = "block";
}
}
}
function hideC(o){
var cs = o.getElementsByTagName("div");
for(var i=0,l=cs.length;i<l;i++){
cs[i].style.display = "none";
}
}
function showP(o){
if(oldP) oldP.style.display = "none";
o.getElementsByTagName("div")[0].style.display = "block";
oldP = o.getElementsByTagName("div")[0];
}
</script>